Question

我正在编写一组JavaScript函数，并且想知道我是否可以使函数更简单（例如更全局的函数）？

我所拥有的是一组5个切换，我想写一个函数toggleOn和toggleOff。我到目前为止写的是：

function toggleOn1() {
$('#chk1').bootstrapToggle('on');                       
}

function toggleOff1() {         
$('#chk1').bootstrapToggle('off');  
}

function toggleOn2() {
$('#chk2').bootstrapToggle('on');                       
}

function toggleOff2() {         
$('#chk2').bootstrapToggle('off');  
}

function toggleOn3() {
$('#chk3').bootstrapToggle('on');                       
}

function toggleOff3() {         
$('#chk3').bootstrapToggle('off');  
}

// etc.

Answer 1

类似的东西：

function customToggle(element, state) {
    $(element).bootstrapToggle(state);
}

Answer 2

任何时候你有一些参数（函数名称的一部分，函数代码正在做的事情）都是一样的，然后将“相同”变成参数：

function toggleGeneric(id, value) {
   $('#chk' + id).bootStrapToggle(value);
}

Answer 3

将Jquery选择器传递给函数

function toggle(selector,state){
         $(selector).bootstrapToggle(state); 
}

选择器和状态都是字符串。

你可以这样称呼它

toggle('#chk1','off');

Answer 4

您可以将selector作为function

的参数传递

function toggleOnOff(selector,state){
         $(selector).bootstrapToggle(state); 
}

如果您想根据以前的状态更改状态，或者您不需要通过该状态：

function toggle(selector){
         $(selector).bootstrapToggle(); 
}

参考here

Answer 5

尝试这样的事情......

var on = 1;
function toggle() {
if (on == 1) {
 $('#chk1').bootstrapToggle('off');   
 on = 0; }
else if (on == 0) {
 $('#chk1').bootstrapToggle('on');
 on = 1;
 } else { 
 }
}

Answer 6

为每个元素添加一个类，并像sew一样更改代码：

$('.chk').on('click', function() {
    $(this).bootstrapToggle();
});

Toggle应该足够智能，以了解开/关之间的区别。

Javascript - 如何避免这个倍数函数同样的建议？

6 个答案: