jQueryUI之autocomplete，datepicker，tabs演示

来源：互联网发布：餐厅排号什么软件编辑：程序博客网时间：2024/05/07 06:38

<!doctype html><html lang="us"><head><meta charset="utf-8"><title>jQuery UI-Test</title><link href="jqueryui/css/jquery-ui-1.10.1.custom.css" rel="stylesheet"><script src="jqueryui/jquery-1.9.1.js"></script><script src="jqueryui/jquery-ui-1.10.1.custom.js"></script><script>$(function(){var availableTags = ["ActionScript","AppleScript","Asp","BASIC","C","C++","Clojure","COBOL","ColdFusion","Erlang","Fortran","Groovy","Haskell","Java","JavaScript","Lisp","Perl","PHP","Python","Ruby","Scala","Scheme"];$( "#autocomplete" ).autocomplete({source: availableTags}); $( "#datepicker" ).datepicker({altField: "#actualDate",dateFormat: "yy-mm-dd" });  $( "#tabs" ).tabs({event:"mouseover"  });})</script></head><body><input type="text" id="autocomplete" name="tt" /><br/><p>Date: <input type="text" id="datepicker" /></p><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>Proin elit arcu, rutrum commodo elementum quam ullamco Mauris </p>  </div>  <div id="tabs-2">    <p>Morbi tincidunt, dui sit amet facilisis feugiat</p>  </div>  <div id="tabs-3">    <p>Mauris eleifend est et turpis. Duis id eratt</p>     </div></div></body></html>