覆蓋使用不同功能的選擇回調

我有一組輸入：覆蓋使用不同功能的選擇回調

<input class="test"></input> 
<input class="test"></input> 
<input class="test"></input> 
<input id="diff" class="test"></input>

和一些jQuery的做的東西，當用戶點擊這些輸入：

$(function() { 
    $(".test").on("click", function() { 
     alert("test"); 
    }); 
    $("#diff").on("click", function() { 
     alert("diff"); 
    }); 
});

目前第四文本框將顯示兩個警報。我如何'覆蓋'默認警告說「測試」只是說「差異」？

非常感謝。

小提琴：http://jsfiddle.net/G3PAy/

非常感謝。

來源

2013-03-04 ale

的。測試點擊功能：如果（$（本）.attr（ '身份證'）= '差異'！）{警報（「測試」）;} // @ – dmoss18 2013-03-04 16:39:30

dmoss18：那倒工作，但它似乎比在jQuery中使用.is（）功能更脆弱。 – Jeff 2013-03-04 16:43:45

我不認爲有來指定不同的處理程序的優先級的方式，所以你需要在第一個單擊處理程序明確排除：

$(".test:not(#diff)").on("click", function() { 
    alert("test"); 
});

第二次單擊處理程序（#diff）保持原樣它是。

來源

2013-03-04 16:40:13 Barmar

只要瀏覽器支持該格式的CSS選擇器，此功能就可以工作。我認爲jQuery將確保這些選擇器即使在舊的瀏覽器上也能正常工作，對吧？ – Jeff 2013-03-04 16:50:05

jQuery有它自己的選擇器處理器，它不依賴於瀏覽器。 – Barmar 2013-03-04 16:50:50

我以爲是。謝謝！ – Jeff 2013-03-04 16:51:35

它讓我感到你可能會以這種錯誤的方式去做。

我首先想到你應該嘗試去設計你的標籤，使#diff標籤沒有相同的類。一種方式是相同的CSS規則適用於一個新的類像這樣：

.test 
{ 
/* CSS rules */ 
}

成爲

.text, .newClass 
{ 
/* new CSS rules */ 
}

但是，如果你不想做，你可以測試對其他屬性在你的jQuery中。

您可以使用下面的代碼來實現你想要的結果：

$(function() { 
    $(".test").on("click", function() { 
     if(!$(this).is("#diff"){ 
     alert("test"); 
     } 
    }); 
    $("#diff").on("click", function() { 
     alert("diff"); 
    }); 
});

來源

2013-03-04 16:42:36 Jeff

有許多不同的方法可以做到這一點，取決於你想要達到什麼樣的邏輯細節。

我選擇把它解釋爲：

每當輸入點擊，運行測試
如果它是一個#diff，提醒我們的，或者
如果它是一個.test，警報我們那

因此，有效地，有一系列的測試，並且一些條件覆蓋其他條件。爲此，您使用jQuery運行常規選擇器，然後使用else if邏輯語句來確定操作過程。

修改代碼在這裏：

$(function() { 
    $("input").on("click", function() { 
     if($(this).is('#diff')){ 
      alert("diff"); 
     } 
     else if($(this).is('.test')){ 
      alert("test"); 
     } 
    }); 
});

演示在這裏： http://jsfiddle.net/barney/QkrbK/

來源

2013-03-04 16:43:27 Barney

這適用於給定的輸入，是真的，但在我看來，問題更多地是關於如何將某些東西應用於一個類並排除滿足另一個標準的特定元素。這將不需要爲每個輸入點擊運行jQuery。 – Jeff 2013-03-04 16:45:47

當我意識到問題開始「我有一組輸入」時，我最初的想法是測試'.test，＃diff'作爲選擇器。我認爲從條件聲明中分離出接受標準是消除邏輯挑戰的好方法。總而言之，jQuery選擇器可能是最容易處理的事情 - 我懷疑解釋器會改變它們太麻煩了。 – Barney 2013-03-04 16:53:10

嘗試event.stopImmediatePropagation()

<input id="diff" class="test" onclick="show();event.stopImmediatePropagation();"></input>

而且

在線點擊事件

見Sample

來源

2013-03-04 17:09:01 Anujith

如果還有其他應該運行的功能，但這種功能可能會發生意想不到的後果。 – Jeff 2013-03-04 17:50:46

覆蓋使用不同功能的選擇回調

回答

相關問題