0

我正在尝试切换两个功能。当用户单击暂停按钮时，输入字段被禁用，标签文本变为灰色，按钮变为不同的图像。我以为我可以使用 .toggle()，但我也无法让这两个函数工作——只有第一个函数运行 ( pauseEmailChannel();)，而不是在切换单击时运行。我在 SO 上找到了偶数/奇数点击检测脚本，但这并不是在点击事件上“切换”这两个函数。我的代码可能是丑陋的代码，但我仍在学习并想展示我的想法——对或错。无论如何，有人可以给我一个解决方案来解决这个问题吗？我不认为这会太难，但我被困住了。谢谢。

HTML

jQuery

      $(".btn_pause").click(function(){
    var count = 0;
        count++;
    //even odd click detect 
    var isEven = function(num) {
        return (num % 2 === 0) ? true : false;
    };
    // on odd clicks do this
    if (isEven(count) === false) {
        pauseEmailChannel(); 
    }
    // on even clicks do this
    else if (isEven(count) === true) {
        restoreEmailChannel(); 
    }
     });


    // when user clicks pause button - gray out/disable     
function pauseEmailChannel(){   
        $("#channel-email").css("color", "#b1b1b1");
        $("#notify-via-email").attr("disabled", true);
        $("#pause-email").removeClass("btn_pause").addClass("btn_disable-pause");
}



// when user clicks cancel button - restore default
function restoreEmailChannel(){
        $("#channel-email").css("color", "#000000");
        $("#notify-email").attr("disabled", false);
        $("#pause-email").removeClass("disable-pause").addClass("btn_pause");
        $("input[value='email']").removeClass("btn_disable-remove").addClass("btn_remove");
}
4

2 回答 2

1

count变量被初始化并设置为每次0单击.btn_pause。您需要将变量移动到更高的范围。

例如，

$(".btn_pause").each(function(){
    var count = 0;
    $(this).click(function(){
        count++;
        ...
    });
});

这种方式count只初始化一次，并且可以在click事件处理程序中访问。

作为替代方式，您还可以使用：

$(".btn_pause").each(function(){
  var count = 0;
  $(this).click(function(){
    [restoreEmailChannel, pauseEmailChannel][count = 1 - count]();
  });
});

如果之前的构造过于抽象，那么更冗长的构造将如下所示：

$(".btn_pause").each(function(){
  /* Current element in the array to be executed */
  var count = 0;
  /* An array with references to Functions */
  var fn = [pauseEmailChannel, restoreEmailChannel];
  $(this).click(function(){
    /* Get Function from the array and execute it */
    fn[count]();
    /* Calculate next array element to be executed.
     * Notice this expression will make "count" loop between the values 0 and 1.
     */
    count = 1 - count;
  });
});
于 2013-01-23T19:06:18.390 回答
1

试试这个代码。它应该可以正常工作，除了当它是偶数和奇数时我可能会出错，但这应该很容易修复。

  $(".btn_pause").click(function(){
    var oddClick = $(this).data("oddClick");
    $(this).data("oddClick", !oddClick);
    if(oddClick) {
        pauseEmailChannel(); 
    }
    else {
        restoreEmailChannel(); 
    }
  });
于 2013-01-23T19:06:45.267 回答