jQueryUI之autocomplete，datepicker，tabs演示
<!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>