Question

首先，我有点困惑，我无法立刻找到答案。问题是关于代码风格。

考虑一个例子：

$('input[type=text]').on('click', doSomething);

如果页面上没有输入，会发生什么？此选择器的结果显示为null，我们收到错误。

所以，我们必须让代码更大更丑陋：

var inputs = $('input[type=text]');

if (inputs) {
    inputs.on('click', doSomething);
}

我喜欢jQuery，并期待这种解决方案更加优雅和简短。

更新

此问题的原因是页面上的3方脚本包含prototype.js。道歉，我应该在发布SO之前在沙盒中测试问题

Answer 1

jQuery选择器将始终返回一个jQuery对象，永远不会为null。

$('#Not exist!').attr('foo', 'foo'); //no error, returns jQuery

与document.getElementById不同：

document.getElementById('Not exist!') == null

Answer 2

如果找不到匹配项，那么选择器实际上不会返回null，这是故意的，因此链接不会中断。这符合jQuery的“少写，做多”的座右铭。

我做了jsFiddle to illustrate this。在浏览器上打开开发人员工具，然后查看控制台。

var doSomething = function(){};
$('input[type=text]').on('click', doSomething); //No error

//...because this:

var obj = $('input[type=text]'); //is a jQuery object, even 
                                 //though there are no <input> elements

console.dir(obj); //Inspect the console. you get: jQuery.fn.jQuery.init[0]

我希望这是有道理的。你可以在你的例子中简单地做前者：

$('input[type=text]').on('click', doSomething);

Answer 3

没有错误，只是一个空对象。你可以去

$('input[type=text]').on('click', doSomething);

Answer 4

我希望这有效......

$('input[type="text"]').on('click', doSomething);

以优雅的方式停止jQuery链接

4 个答案: