jquery esay ui学习

最新推荐文章于 2022-05-13 10:39:08 发布
最新推荐文章于 2022-05-13 10:39:08 发布
阅读量721 收藏
点赞数
分类专栏： HTML+CSS开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lg343028751/article/details/50166375
版权

1.jquery框架自带了一个框架，直接有利于后台开发，下载最新版的jquery esay ui使用引用jshe css

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>EsayUI</title>
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.4.3/themes/icon.css">
    <script type="text/javascript" src="jquery-easyui-1.4.3/jquery.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.4.3/jquery.easyui.min.js"></script>
    <script type="text/javascript">
        $(function(){
            bindevent();
        });
        function bindevent()
        {
            $('.menuitem').click(function(){
                var title=$(this).text();

                //jquery esy ui中tabs带的判断方法，判断该tab项是否存在用，title来判断
                var isExt=$('#tt').tabs('exists',title);
                //给tab页添加上标签
                if(isExt)
                {
                    <span style="font-size:18px;"></span><pre name="code" class="html">                   //jquery esy ui选中该tab，title参数
                    $('#tt').tabs('select',title);
                    return;
                }
                $('#tt').tabs('add',{
                    title: $(this).text(),
                    content: ShowContent($(this).data('url')),
                    closable: true
                    });
            });
        }                   
        function ShowContent(url)
        {
            var strhtml='<iframe src="'+url+'" border="no" scrolling="no" height="100%" width="100%" frameborder="0"></iframe>';
            alert(strhtml);
            return strhtml;
        }

    </script>
</head>

<body  class="easyui-layout">
    <div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">标题</div>
    <div data-options="region:'west',split:true,title:'菜单栏'" style="width:150px;padding:0px;">
        <div class="easyui-accordion" style="width:100%;height:100%">
            <div title="新闻管理" data-options="iconCls:'icon-no'" style="overflow:auto;padding:0px;">
                <ul>
                    <li>
                        <a href="javascript:void(0);" class="menuitem">新闻管理1</a>
                        <ul>
                            <li>
                                <a href="javascript:void(0);" class="menuitem" data-url="ttt.html">新闻管理11</a>
                            </li>
                            <li>
                                <a href="javascript:void(0);" class="menuitem">新闻管理12</a>
                            </li>
                        </ul>

                    </li>
                    <li>
                        <a href="javascript:void(0);" class="menuitem">新闻管理2</a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" class="menuitem">新闻管理3</a>
                    </li>
                </ul>
            </div>
            <div title="评论管理" data-options="iconCls:'icon-help'" style="padding:10px;">
                <p>第二个菜单</p>
            </div>
        </div>
    </div>
    <!-- <div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
-->
<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;">底部</div>

<div data-options="region:'center',title:'首页'">
    <div id="tt" class="easyui-tabs" data-options="tools:'#tab-tools'" style="width:700px;height:250px" fit="true"></div>

</div>
</body>
</html> 

 

 

 


                

        

        

    




    

      

        

            

              
                
                  lg343028751
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                      0
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    0
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      

            

                专栏目录
          










                



	

		

			

				
					
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑

				
			

			

				

					11-26
				

			

		

		

			
				
例如“报告交付方式”包含固定交付时，第二个下拉框不可编辑，反之可以编辑，具体代码如下 报告交付方式：  <select class="easyui-combobox" panelHeight="auto" style="width:195px" data-options="required:...

			
		

	



                

              
                



	

		

			

				
					
esayui datagrid JQuery 一般用的方法

				
			

			

				

					qq_39433030的博客
				

				

					08-25
					
					378
					
				

			

		

		

			
				
dg 为datagrid的id属性


$("#dg").datagrid({
url: uri + "/wapi/User/GetUserShow", //指向一个一般处理程序或者一个控制器，返回数据要求是Json格式，直接赋值Json格式数据也可，我以demo中自带的Json数据为例，就不写后台代码了，但是我会说下后台返回的注意事项
//title: "用户管理",
//align

			
		

	



                


  
              

                


	

		

			

				
					
Easy UI框架

				
			

			

				

					淡水瑜的博客
				

				

					05-10
					
					1310
					
				

			

		

		

			
				
参考资料
文章目录常用前端框架常用前端语言环境搭建API文档Dialog（对话框窗口）easyloader组件parser解析器panle组件新建一个登录界面Form组件validatebox组件layout布局DataGrid（数据表格）
常用前端框架

EasyUI 框架 （组件型）
Bootscrapt 框架 （组件型）
Jquery框架（功能型）
Vue框架（功能型）

常用前端语言
javascript
jQuery
jQuery EasyUI
JSON
环境搭建
jQuery Easy UI下载

			
		

	





	

		

			

				
					
jQuery动态移除和绑定事件

				
			

			

				

					
				

				

					06-25
					
					484
					
				

			

		

		

			
				
function bindEvent() {
     //移除绑定事件
     $('.btnsp').unbind('click');
     //绑定事件
     $('.btnsp').bind('click', function () {
         console.log('test');
     });
 }
 $(function...

			
		

	



		

			
		



	

		

			

				
					
easyui了解

				
			

			

				

					qq_64001795的博客
				

				

					05-13
					
					2804
					
				

			

		

		

			
				
目录

一、框架概述

1、什么是Easyui？

2、EasyUI的常用组件

3、EasyUI的特点

缺点

使用：

4、EasyUI的目录说明

4.1下载路径

4.2 必须的基础支持库

4.3 目录说明

二、WEB项目搭建EasyUI环境

1.EasyUI入门示例

1.1标准开发步骤

1.2 代码模板

1.3 EasyUI的三大基础概念

1.3.1 属性设置

1.3.2 事件触发设置

1.3.3 方法调用设置

2.注意事项

5.关于组件之间的依赖关系

6.控件使...

			
		

	





	

		

			

				
					
Java Web当中使用EasyUI|快速建立漂亮的后台网站（教程+源代码）

				
			

			

				

					程序员猫爪
				

				

					08-19
					
					8946
					
				

			

		

		

			
				
项目源代码下载：
一、EasyUI的概述
1、什么是EasyUI
jQuery EasyUI是一组基于jQuery的UI插件集合体，而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript，也不需要对css样式有深入的了解，开发者需要了解的只有一些简单的html标签。
2、下载EasyUI
官网：https://www.jeasyui.cn/index.php

			
		

	





	

		

			

				
					
easy ui tree 前后端树形结构项目 权限管理demo

				
			

			

				

					07-19
				

			

		

		

			
				
这是基于 easy ui tree 树形结构的一个demo权限管理 前后端代码完整 可直接运行 你可以根据我写的代码自行修改 里面有我的注释 要是有不懂的可以问我 我会尽可能的回复你

			
		

	





	

		

			

				
					
基于esay UI+jsp+servlet+mysql编写的在线考试系统.zip

				
			

			

				

					10-10
				

			

		

		

			
				
基于esay UI+jsp+servlet+mysql编写的在线考试系统

			
		

	





	

		

			

				
					
基于esay UI+jsp+servlet+mysql的在线考试系统源码+项目说明.zip

					
最新发布

				
			

			

				

					01-11
				

			

		

		

			
				
【资源说明】 1、该资源包括项目的全部源码，下载可以直接使用！ 2、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，...基于esay UI+jsp+servlet+mysql的在线考试系统源码+项目说明.zip

			
		

	





	

		

			

				
					
javaScript匿名函数

				
			

			

				

					yinchunjian的专栏
				

				

					04-27
					
					336
					
				

			

		

		

			
				
代码如下:(function(){ //这里忽略jQuery所有实现 })(); (function(){ //这里忽略jQuery所有实现 })(); 
　　半年前初次接触jQuery的时候，我也像其他人一样很兴奋地想看看源码是什么样的。然而，在看到源码的第一眼，我就迷糊了。为什么只有一个匿 名函数又没看到运行（当然是运行了……），就能有jQuery这么个函数库了？于是，我抱着疑问来到CSDN...

			
		

	





	

		

			

				
					
Easy UI常用的UI框架

				
			

			

				

					01-26
				

			

		

		

			
				
Easy UI常用的UI框架 拥有它让你的开发速度提高N倍！！内含easy ui教程等

			
		

	





	

		

			

				
					
EasyUI(前端框架)

					
热门推荐

				
			

			

				

					wyy的博客
				

				

					07-10
					
					1万+
					
				

			

		

		

			
				
第一节 EasyUI的介绍和常用组件
[1]EasyUI的介绍

介绍:


EasyUI是一个前端开发的框架，其将常用的页面开发使用的组件进行了
封装，前端开发人员只需将EasyUI的资源导入项目后使用即可，快速
提升开发效率。


使用：


① 导入EasyUI的资源
② 查阅API文档使用EasyUI的组件完成页面开发


注意：


使用EasyUI，其实就是在使用别人已经封装好的代码来完成自己的页面开发。
所以必须按照EasyUI的文档说明来使用。所以我们学习EasyUI，其实就是在
学习如何按

			
		

	





	

		

			

				
					
用Easy UI快速搭建一个后台

				
			

			

				

					回首一辈子
				

				

					12-08
					
					1万+
					
				

			

		

		

			
				
今天来分享一个我前端技术-------如何使用Easy UI快速搭建一个后台，本博主也只是在官网文档学习了一个小时左右，就已经会使用了，当你学了Easy UI后，一个后台短短两分钟就可以over了，好了，别的不多说了，直接开始表演了；

下面这张图是效果图：



这是我搭建一个SSM（Spring Spring MVC Mybatis）框架体系时候用easy ui快速搭建的一个后台，一个简单的c...

			
		

	





	

		

			

				
					
jquery esay ui 的表格控件使用

				
			

			

				

					
				

				

					11-24
					
					145
					
				

			

		

		

			
				
jquery esay ui 的表格控件使用

JQuery EasyUI的datagrid的使用方式总结
第一步：添加样式和js脚本在前台添加展示数据表格的table元素
 例如：
 <div>
 <table id="tt" style="width: 700px;" title="标题，可以使用代码进行初始化，也可以使用这种属性的...

			
		

	





	

		

			

				
					
Easy UI使用记录

				
			

			

				

					C_____Lee的博客
				

				

					09-20
					
					875
					
				

			

		

		

			
				
Easy UI DataGrid鼠标悬停显示表格内容：
 //鼠标悬停显示内容
            function formatCellTooltip(value) {
                return "<span title='" + value + "'>" + value + "</span>";
            }
自定义DataGrid样式：
 <style>

			
		

	





	

		

			

				
					
Easy-ui常见用法总结

				
			

			

				

					键盘哥的博客
				

				

					10-22
					
					2604
					
				

			

		

		

			
				
消息提示框： 
1.  .messager.alert(‘提示信息′,‘新增项目成功′,‘info′);2..messager.alert(‘提示信息’, ‘新增项目成功’, ‘info’);   
2.   .messager.alert(‘提示信息’, ‘新增项目失败’, ‘warning’);  
通过Id设置不可编辑var SJSHJG = document.getElementById("

			
		

	





	

		

			

				
					
7个jquery easy ui 基本组件图解

				
			

			

				

					bcbobo21cn的专栏
				

				

					04-23
					
					6375
					
				

			

		

		

			
				
下面给出7个jquery easy ui 基本组件；
1 基本面板



	
	Basic Panel - jQuery EasyUI Demo
	
	
	
	
	


	Basic Panel
	The panel is a container for other components or elements.
	
		打开
		关闭
	
	
		jQuery EasyUI framewor

			
		

	





	

		

			

				
					
esay excel

				
			

			

				

					09-02
				

			

		

		

			
				
EasyExcel是一个基于Java的开源项目，用于简化读写Excel的操作。它在尽可能节约内存的情况下，支持读写百M级别的Excel文件。相比于其他的Java处理Excel的框架，如Apache POI和jxl，EasyExcel具有更低的内存消耗。...

			
		

	



              



  
“相关推荐”对你有帮助么？

  

      
    
          
  • 
              
    
                  
                  
              
    
              
    非常没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    没帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    一般
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    有帮助
    
          
    • 
          
  • 
              
    
                  
                  
              
    
              
    非常有帮助
    
          
    • 
      

      

      

          
          提交
      

      

  




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值