<input type="button" value="确认框" /><br /> <input type="button" value="警告框" /><br /> <input type="button" value="输入框" /><br /> <input type="button" value="显示框" /><br /> <script> $("input").click(function(){ //定位button按钮，提供单击事件 var tip=$(this).val(); tip=$.trim(tip); if("警告框"==tip){ $.messager.alert("警告框","警告处分","waring",function(){ //alert("关闭"); }); } if("确认框"==tip){ $.messager.confirm("确认框","你确认要删除么",function(value){ alert(value); }); } if("输入框"==tip){ $.messager.prompt("输入框","请输入你的姓名",function(name){ alert(name); }); } if("显示框"==tip){ $.messager.show({ showType: "slide", showSpeed: 600, width:300, height:300, title:"显示框", timeout:5000, msg:'消息将在5秒后关闭。' } ); } }); </script>
八、表格和树组件的使用
使用$.fn.tree.defaults重写默认值对象。
树控件在web页面中一个将分层数据以树形结构进行显示。它提供用户展开、折叠、拖拽、编辑和异步加载等功能。
<ul> <li> <span>第一章</span> <ul> <li> <span>第一节</span> <ul> <li> <span>第一条</span> </li> <li> <span>第二条</span> </li> </ul> </li> <li> <span>第二节</span> </li> </ul> </li> <li> <span>第二章</span> </li> </ul> <script type="text/javascript"> $(function(){ //收起所有的选项 $("#treeID").tree("collapseAll"); }); </script>
我们还可以引入外部文件，使用json格式的文件来添加到这个tree中。
<ul></ul> <script type="text/javascript"> $("#treeID").tree({ url : "/EasyUi/json/pro.json" }); </script>
json格式为：
[ { "id":1, "text":"广东", "state":"closed", "children":[ { "id":11, "text":"广州" , "state":"closed", "children":[ { "id":111, "text":"天河" }, { "id":112, "text":"越秀" } ] }, { "id":12, "text":"深圳" } ] }, { "id":2, "text":"湖南" } ]
以上所述是小编给大家介绍的jQuery EasyUI基础教程之EasyUI常用组件(推荐)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
您可能感兴趣的文章: