条件，引用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>部分 </h3>

  <div>

    <p>hello，我是第一段。 </p>

  </div>

  <h3>部分 </h3>

  <div>

    <p>hello，我是第er段。 </p>

  </div>

  <h3>部分 </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="#tabs-1">Nunc tincidunt</a></li>

    <li><a href="#tabs-2">Proin dolor</a></li>

    <li><a href="#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

六、带图标的按钮 http://www.w3cschool.cc/jqueryui/example-button.html

 <script>

   $(function() {

  $( "#btnleft" ).button({

       icons: {

         primary: "ui-icon-locked"

       }

     });

 $("#btntwopic").button({

       icons: {

         primary: "ui-icon-gear",

         secondary: "ui-icon-triangle-1-s"

       }

     });

   });

   </script>

 <button id="btnleft">图标在左侧的按钮</button>

 <button id="btntwopic">带有两个图标的按钮</button>

//如果需要执行服务器端事件 
<asp:button id="btnleft" runat="server" onclick="btnleft_Click" Text="确认">确认</asp:button>
//在后台的page_load函数中增加属性可以先执行web前端的函数 
btnleft.attributes.add("onclick","return btnleft_clientclick()");

七、日期选择器

  <script>

  $(function() {

    $( "#fldfirstdate" ).datepicker();

  });

  </script>

</head>

<body>

<p>日期：<input type="text" id="fldfirstdate"  ></p>

八、格式化日期格式，例如[yy-mm-dd]  参考tongfang吧。

jquery ui 常用（一）（自动完成 | 标签页 | 折叠面板 | 带图标的按钮 | 日期选择器| ）的更多相关文章

  1. 弹窗中使用jquery ui的autocomplete自动完成插件无效果 实际是被遮挡了

    在普通页面上使用jquery ui的autocomplete自动完成插件时正常显示提供选择的下拉框,但是放到弹窗中的时候就无法显示这个选择的下拉框,其它效果正常: 估计是被弹出窗遮挡了,网络搜索了jq ...

  2. 基于jQuery带备忘录功能的日期选择器

    今天给大家分享一款基于jQuery带备忘录功能的日期选择器.这款日期控制带有备记忘录功能.有备忘录的日期有一个圆圈,单击圆圈显示备忘录.该实例适用浏览器:360.FireFox.Chrome.Safa ...

  3. Struts2 JQuery UI常用插件

    一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...

  4. jQuery UI常用插件使用

    一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...

  5. jQuery(UI)常用插件

    jQuery 官方网站:http://jquery.com/ 下载地址:http://jquery.com/download/ 插件地址: http://plugins.jquery.com/ 常用插 ...

  6. jquery的常用操作（操作html页面的Dom对象的元素）

    一:页面加载完成时,会执行jquery的方法(不需要等待图片加载完成,只要dom结构加载完成,就执行该方法) //第一种写法: $(document).ready(function() { // 执行 ...

  7. jquery ui 常用（二）（对话框 | 旋转器 | 工具提示框（表单） | 特效（百叶窗） ）

    一.添加信息的对话框  http://www.w3cschool.cc/try/tryit.php?filename=jqueryui-example-dialog-modal-form. 模态表单 ...

  8. jQuery UI：邮箱自动补全函数

    $('#email').autocomplete({ delay:0, autoFocus:true, source:function(request,response){ var hosts = [ ...

  9. 如何设置使chrome新标签页中打开链接自动跳转到新标签页?

    在新标签打开链接的时候这样点选 Ctrl+左键 或者 鼠标中键 或者 右键链接选择'新标签页中打开链接', 可实现出现新标签页但不自动跳转 但是这个有问题, 即, 新标签只是在背景打开, 操作后并不会 ...

随机推荐

  1. hive DDL

    官网地址:https://cwiki.apache.org/confluence/display/Hive/LanguageManual+DDL https://cwiki.apache.org/co ...

  2. Aws api gateway Domain name

    Set Up a Custom Domain Name for an API Gateway API The following procedure describes how to set up a ...

  3. Azure Remote Desktop: "An error occurred while loading from file *.rdp"

    Tonight I deployed a new cloud service where I needed remote desktop to check on some things. After ...

  4. Spring 依赖注入，在Main方法中取得Spring控制的实例

    Spring依赖注入机制,在Main方法中通过读取配置文件,获取Spring注入的bean实例.这种应用在实训的时候,老师曾经说过这种方法,而且学Spring入门的时候都会先学会使用如何在普通的jav ...

  5. Swift实战-QQ在线音乐(AppleWatch版)

    1.打开项目QQMusic,然后点菜单:“File-New-Target”添加appleWatch扩展项 2.选择Swift语言,把Include Notification Scene前的勾去掉 (项 ...

  6. spfa的SLF优化

    spfa的SLF优化就是small label first 优化,当加入一个新点v的时候如果此时的dis[v]比队首dis[q.front()]还要小的话,就把v点加入到队首,否则把他加入到队尾,因为 ...

  7. 【Origin】工仕途中

    -脚步翩跹,随蝶起舞,翩翩不知所往 晨起脚步催, 蝴蝶迎面飞; 正是春意浓, 三月好风景. -作于二零一六年三月二十八日

  8. [摘录]quarts：feature

    Features of Quartz Runtime Environments Quartz can run embedded within another free standing applica ...

  9. cookie和session区别

    cookie和session区 session是在服务器端保存用户信息,cookie是在客户端保存用户信息 session保存的是对象,cookie保存的是字符串 session会随回话结束而关闭,c ...

  10. 。。。JDBC里面的sql与hibernate里面的hql有关占位符"?"的总结。。。

    今天在看Hibernate的时候,似乎又有了一些收获的东东,嘻嘻... 我记得很清楚:以前用JDBC操作数据库的时候是这样的: String sql = "select * from use ...