首页 > 代码库 > jquery ui 常用
jquery ui 常用
条件，引用3个文件 jquery-ui.min.css; jquery.min.js; jquery-ui.min.js。
一、自动完成 http://www.w3cschool.cc/jqueryui/example-autocomplete.html
var availableTags = [
"ActionScript",
"AppleScript"];
$( "#mytags" ).autocomplete({
source: availableTags
});
<div class="ui-widget">
<label for="tags">标签：</label>
<input id="mytags">
</div>
二、折叠面板 http://www.w3cschool.cc/jqueryui/example-accordion.html
<script> $(function() { $( "#accordion" ).accordion(); }); </script><div id="accordion"> <h3>部分 1</h3> <div> <p>hello，我是第一段。 </p> </div> <h3>部分 1</h3> <div> <p>hello，我是第er段。 </p> </div> <h3>部分 1</h3> <div> <p>hello，我是第三段。 </p> </div></div>
三、标签页切换 http://www.w3cschool.cc/jqueryui/example-tabs.html
<script> $(function() { $( "#tabs" ).tabs(); }); </script><div id="tabs"> <ul> <li><a href=http://www.mamicode.com/"#tabs-1">Nunc tincidunt</a></li> <li><a href=http://www.mamicode.com/"#tabs-2">Proin dolor</a></li> <li><a href=http://www.mamicode.com/"#tabs-3">Aenean lacinia</a></li> </ul> <div id="tabs-1"> <p>第一</p> </div> <div id="tabs-2"> <p>第二</p> </div> <div id="tabs-3"> <p>第三</p> <p>还是第三</p> </div></div>
四、标签页的排序： http://www.w3cschool.cc/try/tryit.php?filename=jqueryui-example-tabs-sortable
五、标签页的动态添加 http://www.w3cschool.cc/try/tryit.php?filename=jqueryui-example-tabs-manipulation
jquery ui 常用
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。