3

最后,我决定这不是我特别需要解决的问题,但是我不明白为什么会这样,这让我很困扰。

基本上,我有一些复选框,我只希望用户能够选择一定数量的复选框。我正在使用下面的代码来实现这种效果。


$j( function () {
    $j('input[type=checkbox].vote_item').click( function() {
        var numLeft = (+$j('#vote_num').text());
        console.log(numLeft);
        if ( numLeft == 0 && this.checked ) {
            alert('I\'m sorry, you have already voted for the number of items that you are allowed to vote for.');
            return false;
        } else {
            if ( this.checked == true ) {
                $j('#vote_num').html(numLeft-1);
            } else {
                $j('#vote_num').html(numLeft+1);
            }
        }
    });
});

当我测试它时,我注意到如果我使用:


$j('input[type=checkbox]').each( function () {
    this.click()
});

Javascript 的反应与我预期的一样,但是当与以下设备一起使用时:


$j('input[type=checkbox]').each( function () {
    $j(this).click()
});

它实际上会使计数器计数。

我确实意识到这不是使用计数器保持计数的最安全方法,但是我确实有服务器端错误检查,可以防止在数据库中输入超过必要的数量,这就是我决定的原因它实际上不需要修复。

编辑: $j 是由于我必须在 noConflict 模式下使用 jQuery...

4

3 回答 3

6

$(this) 包含一个 jQuery 包装器(有很多函数),而 this 只是 DOM 对象。

于 2009-06-30T21:18:59.033 回答
3

计数器上升的事实给了我线索,即您正在使用的已检查属性与手动触发点击事件之间存在链接。

我在 Google 上搜索了“jquery checkbox click event raise”并找到了这个链接,作者面临着完全相同的问题和他使用的解决方法。

http://www.bennadel.com/blog/1525-jQuery-s-Event-Triggering-Order-Of-Default-Behavior-And-triggerHandler-.htm

附带说明一下,我认为您可以进一步简化代码:

$j('input[type=checkbox].vote_item').click( 
function() 
{
    var maxNumberOfChoices = 5;

    //get number of checked checkboxes. 
    var currentCheckedCount = $j('input[type=checkbox].vote_item :checked');

    if(currentCheckedCount > maxNumberOfChoices)
    {
        //It's useful if you show how many choices user can make. :)
        alert('You can only select maximum ' + maxNumberOfChoices + ' checkboxes.');
        return false;
    }

    return true;
});
于 2009-06-30T21:38:53.720 回答
3

this.click()调用浏览器 DOM 方法click()

$(this).click()调用 jQuery 方法click(),它不仅仅调用浏览器方法:详情请参阅函数的实现trigger

于 2009-06-30T21:41:21.983 回答