带有 jquery 的选项卡（默认选项卡）答案

【问题标题】：tabs with jquery (default tab)带有 jquery 的选项卡（默认选项卡）
【发布时间】：2012-11-17 11:00:42
【问题描述】：

我为标签使用了一个简单的 jquery 代码，它的想法是：在每个标签中我都有一个表单，当我提交每个表单时，代码会给我来自 mysql 的值。问题是，当我在例如选项卡 3 中提交表单时，它会在我显示任何结果之前将我重定向到第一个选项卡（默认选项卡）。任何解决此问题的建议。提前致谢，我的代码：

 <script type="text/javascript">
 $(function() {
 $( "#tabs" ).tabs();
   });
</script>

HTML 代码：

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">tab 1</a></li>
        <li><a href="#tabs-2">tab 2</a></li>
        <li><a href="#tabs-3">tab 3</a></li>
    </ul>
    <div id="tabs-1">
         <p>tab 1 content</p>
    </div>
    <div id="tabs-2">
         <p>tab 2 content</p>
    </div>
    <div id="tabs-3">
         <p>tab 3 content</p>
    </div>

</div>

【问题讨论】：

标签： php javascript jquery jquery-ui codeigniter

【解决方案1】：

如果你使用 php，你可以使用例如包含选项卡编号的表单中隐藏的 html 字段。提交表单时，您可以解析该变量并在 jQuery 代码中使用它。如果您在 jQuery 代码中使用 php，则可能如下所示：

$("#tabs").tabs({ 
    selected: <?php echo (isset($_POST['selected_tab']) ? $_POST['selected_tab'] : 1)?> 
});

【讨论】：

【解决方案2】：

你开玩笑地使用这个代码

$( ".selector" ).tabs( "load", 2 );

加载后调用此选项卡，以便您选择 2 个选项卡。试试看！！

【讨论】：

【解决方案3】：

您可以将参数传递给 tabs() 函数 (http://api.jqueryui.com/tabs/)

 <script type="text/javascript">
 $(function() {
     $( "#tabs" ).tabs({active: 2});
 });
 </script>

【讨论】：

这将激活标签号 2。
不，它是从零开始的索引：0 - 用于 #tabs-1, ... , 2 - 用于 #tabs-3

【解决方案4】：

如果您提交表单，则您说“表单”，页面将发送数据并自行刷新。只需使用一个按钮，当单击该按钮时，发送 ajax。

【讨论】：