jQuery UI选项卡转到选项卡中的特定div
|
我有使用JqueryUI设置的基本标签（仅简化为两个相关的标签）
<div id=\"tabs\">
<ul>
<li><a href=\"#tabs-1\">Home</a></li>
<li><a href=\"#tabs-5\">Benefits</a></li>
</ul>
<div id=\"tabs-1\">
<UCHome:UCHome runat=\"server\" />
</div>
<div id=\"tabs-5\">
<UCBenefits:UCBenefits runat=\"server\" />
</div>
</div>
<a class=\"benefitc\" href=\"#benefitsmodularity\">
<span>Modularity</span>
<asp:Image runat=\"server\" ImageUrl=\"../Images/Benefits1.png\"/></a>
<a class=\"benefitc\" href=\"#benefitsflexibility>
<span>Flexibility</span><asp:Image runat=\"server\" ImageUrl=\"../Images/Benefits2.png\" /></a>
<div class=\"homecontent\">
<div id=\"benefitsmodularity\">
<h2>
(Modularity)</h2>
<p>
Hello
</p>
</div>
</div>
<div class=\"homecontent\">
<div id=\"benefitsflexibility\">
<h2>
(Flexibility)</h2>
<p>
World
</p>
</div>
</div>
var $tabs = $(\"#tabs\").tabs();
$(\'.benefitc\').click(function () { // bind click event to link
$tabs.tabs(\'select\', 4); // switch to tab
return false;
});
没有找到相关结果
已邀请:
3 个回复
皇小福另届
$(\'.benefitc\').click(function () { // bind click event to link $tabs.tabs(\'select\', 4); // switch to tab return false; });取得了预期的效果。呸溉
$( \".selector\" ).tabs({ active: 1 });// getter var active = $( \".selector\" ).tabs( \"option\", \"active\" );<br> // setter $( \".selector\" ).tabs( \"option\", \"active\", 1 );吞睫素
<!doctype html> <html lang=\"en\"> <head> <meta charset=\"utf-8\" /> <title>jQuery UI Tabs - Default functionality</title> <link rel=\"stylesheet\" href=\"http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css\" /> <script src=\"http://code.jquery.com/jquery-1.9.1.js\"></script> <script src=\"http://code.jquery.com/ui/1.10.3/jquery-ui.js\"></script> <link rel=\"stylesheet\" href=\"/resources/demos/style.css\" /> <script> $(function() { $( \"#tabs\" ).tabs(); }); </script> </head> <body> <div id=\"tabs\"> <ul> <li><a href=\"#tabs-1\">HOME</a></li> <li><a href=\"#tabs-2\">About Us</a></li> <li><a href=\"#tabs-3\">Contact</a></li> </ul> <div id=\"tabs-1\"> <p>Home Page</p> <button>Page 2</button> <script> $( \"button\" ).click(function() { $( \"#tabs\" ).tabs( \"option\", \"active\", 1 ); <!-- Activate Tab Two --> alert(\" It ran!\"); }); </script> </div> <div id=\"tabs-2\"> <p>This is what we are all about.</p> </div> <div id=\"tabs-3\"> <p>Name First Last</p> <p>Town, City, Zip</p> </div> </div> </body> </html>