在点击Jquery中的标签菜单上的项目后提交表单

Question

以下示例为：http://jqueryui.com/demos/tabs/，我希望在单击标签-2菜单时提交表单。

以下是我的代码。但是，点击后表单不提交。

任何人都可以帮助我吗？非常感谢！

<script> 
    $(function() { 
     $("#tabs").tabs(); 

     $('#tabs-2').click(function() { 
      $('#target').submit(); 
     }); 
    }); 
</script> 
<div id="tabs"> 
    <form id="target"> 
     <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"> 
     </div> 
     <div id="tabs-2"> 
     </div> 
     <div id="tabs-3"> 
     </div> 
    </form> 

Answer 1

你可能会发现tab插件阻止点击的默认动作，而不是调用你的点击事件。

你应该尝试挂钩到tabselect事件来代替，而ui.tab检查所选标签的href属性是#tabs-2。

$("#tabs").bind("tabsselect", function(event, ui) { 
    if(ui.tab.attr('href') == '#tabs-2') { 
     $('#target').submit(); 
    } 
}); 

或者当您创建的标签，而不是你可以这样做：

$("#tabs").tabs({ 
    select: function(event, ui) { 
     if(ui.tab.attr('href') == '#tabs-2') { 
      $('#target').submit(); 
     } 
    } 
}); 

你也可以使用ui.index获得所选标签的零basde指数，或ui.panel得到为该选项卡选择的内容div。无论你喜欢什么！

Answer 2

$(document).ready(function(){ 
    $('#tabs-2').click(function() { 
     $('#target').submit(); 
    }); 
});