另一种编写javascript的方式

另一种更简洁的方式来编写以下内容。基本上它基于一个条件切换2个按钮的可见性。另一种编写javascript的方式

$("#myCheckBox").click(function() { 
    if (window.console && window.console.log) 
     console.log("billing only checked? " + this.checked); 
    if (this.checked) { 
     $("#btnNext").hide(); 
     $("#btnFinish").show(); 
    } 
    else { 
     $("#btnNext").show(); 
     $("#btnFinish").hide(); 
    } 
});

只是寻找一个更有效的方式吗？

来源

2011-10-21 Rod

你只会写出更加细致的写法，通常意味着“难以阅读”。保持原样 - 没关系。 –

按钮是否隐藏起始？点击复选框之前的事件？ –

为了便于阅读，您应该进行优化。你为什么认为这不够有效？ – ObscureRobot

您可以使用.toggle，它接受指示元素是否应显示或隐藏的参数：

$("#btnNext").toggle(!this.checked); 
$("#btnFinish").toggle(this.checked);

如果能见度正确地从成立伊始，你甚至不必传递一个参数：

$("#btnNext, #btnFinish").toggle();

我同意与他人有关的可读性，但。本身可能仍然可以理解，但.toggle(!this.checked)可能变得更难以理解。

来源

2011-10-21 17:36:08

这是一个很好的解决方案，因为它可以在减少代码的同时提高清晰度。 – ObscureRobot

它可能不是100％的效率 - 我敢肯定，你可以通过使用一个聪明的三元或凝结的东西这个（编辑：费利克斯·克林有一个很好的话） - 但在另一方面，它是完美的即使对于一个对项目不熟悉的人也是如此。

我的倾向是保持原样。

来源

2011-10-21 17:36:19

使用切换（）函数 - http://api.jquery.com/toggle/

来源

2011-10-21 17:36:20

您可以使用.toggle()：

$("#myCheckBox").click(function() { 
    if (window.console && window.console.log) 
     console.log("billing only checked? " + this.checked); 
    $("#btnNext").toggle(!this.checked); 
    $("#btnFinish").toggle(this.checked); 
});

来源

2011-10-21 17:36:33 gilly3

您可以减少这样的：

if (this.checked) { 
    $("#btnNext").hide(); 
    $("#btnFinish").show(); 
} 
else { 
    $("#btnNext").show(); 
    $("#btnFinish").hide(); 
}

这样：

$("#btnNext").toggle(!this.checked); 
$("#btnFinish").toggle(this.checked);

来源

2011-10-21 17:36:35 Jon

假设它们以正确的show和hide状态开始，则只需执行以下操作即可。

$("#myCheckBox").click(function() { 
    if (window.console && window.console.log) { 
    console.log("billing only checked? " + this.checked); 
    } 
    $("#btnNext").toggle(); 
    $("#btnFinish").toggle(); 
}

来源

2011-10-21 17:36:38 JaredPar

你可以使用.toggle()而不是show/hide，那么你可以摆脱if/else结构。

来源

2011-10-21 17:37:16

另一种编写javascript的方式

回答

相关问题