Question

我希望在每次模糊或点击或聚焦无线电输入事件时获得已检查无线电输入的值。

function getCheckedVal(){
    var checked = $('#education_number input:radio:checked')
    console.log(checked.val());
};

这不起作用：

window.onload = function(){
    var radio = $('#education_number input:radio');
    for(var i=0; i<radio.length; i++){
        radio[i].addEventListener('blur', function(){getCheckedVal()});
        };
    }

这是一个例外：

window.onload = function(){
    var radio = $('#education_number input:radio');
    for(var i=0; i<radio.length; i++){
        radio[i].bind('blur', getCheckedVal());
        };
    }

未捕获的TypeError：对象#HTMLInputElement没有方法'bind'

怎么做？

Answer 1

在第二个示例中，您调用 getCheckedVal，然后将其返回值传递给bind。您不希望在()之后使用getCheckedVal：

window.onload = function(){
    var radio = $('#education_number input:radio');
    for(var i=0; i<radio.length; i++){
        $(radio[i]).bind('blur', getCheckedVal);
    }
}

（注意我在$(...)附近添加了radio[i]，因为radio[i]是一个原始DOM元素，而不是jQuery对象。）

但是你可以大大简化代码：

window.onload = function(){
    $('#education_number input:radio').blur(getCheckedVal);
}

jQuery非常基于集合。您可以对整个匹配的元素集进行操作，而不是自己循环遍历集合。

但要考虑两件事：

你真的只想要关于模糊的这些信息吗？例如，不在change上？
你真的想等到window#load事件来挂钩事件处理程序吗？在所有图片等已完成加载后，页面加载过程中的非常。不要使用window#load，而是考虑将脚本放在最后，就在结束</body>标记之前，或者使用jQuery的ready function。

Answer 2

bind是一个jQuery方法，但是你在这个阶段所拥有的只是一个HTMLInputElement - 幸运的是，你可以将一个元素传递给jQuery并获得对其所有功能的访问：

变化：

radio[i].bind('blur', getCheckedVal());

到

$(radio[i]).bind('blur', getCheckedVal);

您还需要从getCheckedVal中删除括号 - 将getCheckedVal（）传递给bind将导致立即计算函数，并且只有返回值将绑定到您的事件。相反，您需要将函数引用传递给bind。

Answer 3

只是：

$('#education_number input:radio').bind('blur', getCheckedVal);

请注意()后遗失的getCheckedVal。您必须将引用传递给该函数，而不是调用该函数。

我建议您阅读其中一个jQuery tutorials，了解基本知识。

jQuery的一大优势是它可以让您轻松地对HTML元素集合执行操作。 $('selector')总是返回一个jQuery对象，以便您可以利用它。如果你有一个纯粹的DOM元素数组，那么是的，你必须迭代它们并单独绑定事件处理程序。

如何在数组中使用jQuery bind或addEventListener？

3 个答案: