Question

我在列表中有一堆导航链接。每次我点击我想要的链接时都会显示一些DIV并隐藏所有其他链接。这是常见的内容面板模式。

我无法通过这样做来实现：

<script type="text/javascript">
jQuery(document).ready(function() {

function show_tab(t) {
    jQuery(".tab").hide();
    jQuery(t).toggle();
}

jQuery("#login").click( show_tab("#login_tab") );

jQuery("#projects").click( show_tab("#projects_tab") );

});
</script>

但我可以通过使用匿名函数使其工作：

<script type="text/javascript">
jQuery(document).ready(function() {

jQuery("#login").click(function()
{
jQuery(".tab").hide();
jQuery("#login_tab").toggle();
});

jQuery("#projects").click(function()
{
jQuery(".tab").hide();
jQuery("#projects_tab").toggle();
});

});
</script>

有人可以解释为什么一种方法有效而另一种方法没有？

Answer 1

您需要传递name function而不是调用它。

jQuery("#login").click( show_tab );    
jQuery("#projects").click( show_tab) );

您可以使用当前元素的id来生成show_tab

中标签的ID

function show_tab()
{    
    jQuery(".tab").hide();  
    jQuery("#" + this.id + "_tab").toggle();    
}

Answer 2

变化：

jQuery("#login").click( show_tab("#login_tab") );
jQuery("#projects").click( show_tab("#projects_tab") );

到

jQuery("#login").click( function() {
 show_tab("#login_tab");
});
jQuery("#projects").click( function() {
    show_tab("#projects_tab");
});

Answer 3

当你这样做时......

jQuery("#login").click( show_tab("#login_tab") );

它立即运行show_tab("#login_tab")并将结果用作.click处理程序分配中的参数。如果您需要在不运行函数的情况下传递函数，则必须在不带括号的情况下引用它。你可以做到这一点......

jQuery("#login").click( function() {
    show_tab("#login_tab");
} );

甚至是......

jQuery("#login").click( show_login_tab );

function show_login_tab() {
    show_tab("#login_tab");
}

从本质上讲，这与创建匿名函数相同，就像在工作版本中所做的那样。

jquery click不能正常使用

3 个答案: