按鈕點擊事件觸發錯誤的事件處理程序

我有一個div顯示一些可點擊的音樂標題。當你點擊它時會顯示一些更詳細的信息。然後我在可點擊的div中也有一個按鈕。當我點擊按鈕。它不會調用按鈕的功能，但div的功能？有沒有辦法解決這個問題？謝謝！按鈕點擊事件觸發錯誤的事件處理程序

$("#myComList").append("<div id="+comListID+" class=listDiv> <p class=comTitle><? echo $row["compositionTitle"] ?>(<?echo $row["year"]?>)</p><button id="+comListID+"btn class=addNewArrBtn>Add new Arrangement</button> <p class=comOri>BY <? echo $row["OrigComposer"] ?></p> </div>"); 
     $('#'+comListID).click(function() { 
       $(this).find("li").slideToggle('slow', function() { 
      }); 
     $("#"+comListID+"btn").click(function(){ 
       addNewArr(comListID); 
      });

來源

2012-12-13 lancellx

是的，這是可能的。 –

我將此代碼添加到此部分 – lancellx

它被稱爲'冒泡'。該按鈕位於div內，因此它正在執行按鈕，然後鏈接到div。在按鈕函數內添加event.stopPropagation（）。

$("#"+comListID+"btn").click(function(event){ 
    event.stopPropagation(); 
    addNewArr(comListID); 
});

來源

2012-12-13 21:51:25 Syon

此方法拼寫爲「stopPropagation」。 – radbyx

從jQuery的文檔：

默認情況下，從原來的事件目標大多數事件冒泡到文檔元素。在沿途的每個元素中， jQuery調用已附加的任何匹配事件處理程序。處理程序可以通過調用event.stopPropagation（）來阻止事件進一步向上冒泡文檔樹（並因此阻止處理這些元素的處理程序）。但是，當前元素上附加的任何其他處理程序都將運行。爲了防止這種情況，請致電 event.stopImmediatePropagation（）。（綁定到一個元素調用事件處理程序以相同的順序，他們的約束。）

http://api.jquery.com/on/

所以你會打電話event.stopPropagation()按鈕單擊處理程序中，如從停止DIV事件射擊。

來源

2012-12-13 21:52:41 rmobis

我相信我理解你的問題而不看代碼。它聽起來像是源於點擊事件冒泡或傳播的問題。下面是代碼樣本，試圖到小提琴的鏈接，爲您的測試：

<div id="testDiv" onclick="alert('Stop Clicking Me!');"> 
    <button type="button" onclick="function(e) { alert('You hit the button!'); e.stopPropagation(); }">Click Me!</button> 
</div>

在此功能中，：

e.stopPropagation();

防止click事件從篩選到它的父容器（在這種情況下是「testDiv」）並觸發其點擊事件。你可以測試一下，看看自己在下面的jsfiddle：

Test Fiddle

編輯：

你的情況：

$("#"+comListID+"btn").click(function(e){ 
    addNewArr(comListID); 
    e.stopPropagation(); 
});

事件參數添加到點擊功能和阻止它傳播給父母。

希望這會有所幫助。

來源

2012-12-13 21:55:48 War10ck

按鈕點擊事件觸發錯誤的事件處理程序

回答

相關問題