Question

美好的一天，这可能是一个愚蠢的问题:)如何使用.on将参数传递给外部javascript函数？

视图：

<script>
    var attachedPo = 0;
    $this.ready(function(){ 
    $('.chckboxPo').on('ifChecked', addPoToBill(attachedPo));
    $('.chckboxPo').on('ifUnchecked', removePoToBill(attachedPo ));
});

</script>

外部脚本：

function addPoToBill(attachedPo){
attachedPo++;
}

function removePoToBill(attachedPo){
attachedPo--;
}

但我收到了错误！感谢指导：）

Answer 1

您需要将处理程序包装在匿名函数中：

$('.chckboxPo')
    .on('ifChecked', function() {
        addPoToBill(attachedPo);
    })
    .on('ifUnchecked', function() {
        removePoToBill(attachedPo);
    });

您也可以将调用链接到on，因为它们被附加到同一元素。

Answer 2

如果您打算计算检查了多少个框，通过间接将变量传递给函数，请尝试使用对象，如下所示：

JSFiddle：http://jsfiddle.net/TrueBlueAussie/pBkhX/

var attachedPo = {
    count: 0
};
$(function () {
    $('.chckboxPo')
        .on('change', function () {
        if ($(this).is(':checked')) {
            addPoToBill(attachedPo);
        } else {
            removePoToBill(attachedPo);
        }
        $("#output").prepend("" + attachedPo.count + "<br/>");
    });
});

function addPoToBill(attachedPo) {
    attachedPo.count++;
}

function removePoToBill(attachedPo) {
    attachedPo.count--;
}

如果它没有做任何其他事情，你可以简化整个事情来计算checked复选框：

$(function () {
    var attachedPo = 0;
    $('.chckboxPo')
        .on('change', function () {
            attachedPo = $(".chckboxPo:checked").length;
    });
});

“DOM Ready”事件：

你还需要将它包装在这样一个现成的处理程序中，而不是你现在所拥有的：

$(function(){
    ...
});

*注意：$(function(){YOUR CODE HERE});只是$(document).ready(function(){YOUR CODE HERE});

的快捷方式

您还可以执行“更安全的版本”（确保本地范围$），如下所示：

jQuery(function($){
    ...
});

这是有效的，因为当你的“on load”匿名函数被调用时，jQuery将引用传递给自己作为第一个参数。

还有其他变体可以避免与其他库冲突（不是很常见，因为大多数现代lib都知道现在将$留给jQuery）。只需查看jQuery.noConflict即可了解更多信息。

如何使用.on在jquery中传递参数？

2 个答案:

“DOM Ready”事件：