停止以優雅的方式鏈接jQuery

首先，我有點困惑，我無法立即在SO上找到答案。問題是關於代碼風格。停止以優雅的方式鏈接jQuery

考慮這樣一個例子：

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

如果在頁面上沒有投入，會發生什麼？這個選擇器的結果似乎是null，我們得到一個錯誤。

因此，我們必須使代碼更大，醜陋：

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

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

我愛jQuery和期待此次的解決方案更優雅和縮寫形式。

UPDATE

這個問題的原因是prototype.js通過頁面上的3方腳本包括在內。道歉，我應該在沙箱上張貼SO

來源

2013-02-28 Dan

沒有，這正是做*不*發生。你可以寫'$（「foobarbaz」）。on（'click'，無論），它會一直工作（當然什麼都不做）。 – Jon 2013-02-28 18:06:41

嘗試一下，然後再遵循你的邏輯！ – Shef 2013-02-28 18:06:56

原因是jQuery'$'對象沒有被寫入。道歉。我認爲我們應該刪除這個問題。謝謝大家！ – Dan 2013-02-28 18:12:44

jQuery選擇總是會返回一個jQuery對象之前測試的問題，你將永遠不會空。

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

不像document.getElementById：

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

來源

2013-02-28 18:06:19 gdoron

jquery 1.7.2爲我返回null，等待小提琴... – Dan 2013-02-28 18:08:56

@丹，我敢打賭它不會......等待。 – gdoron 2013-02-28 18:10:12

順便說一句，這是我更喜歡jquery到mootools的最大原因。鏈中間沒有隨機的空元素錯誤。非常優雅地使用鏈接和空處理。 – Kristian 2013-02-28 18:11:50

沒有錯誤，只是一個空的對象。你可以去用

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

來源

2013-02-28 18:08:08 monxas

的選擇其實沒有返回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);

來源

2013-02-28 18:11:37

我希望這個作品......

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

來源

2013-02-28 18:26:22

好吧，'text'和''text「'變體在CSS2 +或jQuery 1+中都可以正常工作。問題是，在某些時候，'''變量被'prototype.js'：P覆蓋，這不像jQuery那麼好！ – Dan 2013-03-01 10:34:33

停止以優雅的方式鏈接jQuery

回答

相關問題