jquery綁定點擊標籤發射兩次

當我添加一個選擇到標籤和綁定點擊事件，jquery發射兩次。jquery綁定點擊標籤發射兩次

HTML：

<label class="lol"> 
    <div> 
     bla 
    </div> 
    <div style="display:none;"> 
     <select></select> 
    </div> 
</label>

的javascript：

$("label.lol").on({ 
    click : function() 
    { 
     alert(1); 
    } 
})

我怎樣才能修復這個bug無添加「的」屬性標籤？

來源

2013-02-08 Özgür Fırat Özpolat

有意思。看起來你只能在不包含div的標籤標籤內使用短語內容。 [源代碼]（https://developer.mozilla.org/en-US/docs/HTML/Content_categories#Phrasing_content） – 2013-02-08 15:30:28

ubuntu/firefox在你的小提琴中觸發一次 – mikakun 2013-02-08 15:30:32

當你只選擇'$ （「label.lol div：first」）' – sofl 2013-02-08 15:32:26

我知道這個問題已經有很多答案，但含糊不清。

$("label.lol").on({ 
    click : function() 
    { 
     alert(1); 
     return false; 
    } 
});

好的，大家都讚賞。問題解決了。但問題出現爲什麼return false;。

回答簡單的話：這是告訴電腦的方式，從函數返回，我給你的任務完成。現在沒有更多的混亂。

來源

2013-02-08 15:36:11

謝謝Aspiring Aquib;有效。你覺得它是一個錯誤？ – 2013-02-09 07:46:44

點擊事件傳播或冒泡使其運行兩次的DOM。一個在它自己和其他選擇標籤（或任何其他表單元素）之間。你可以看到這個小提琴：http://jsfiddle.net/5QAS2/ **它是什麼？**當'輸入'或任何其他標籤位於標籤元素之間時，該函數運行兩次。而當表單元素不在其中時。我沒有對此做過研究。所以，無法解釋更多或不能說它是一個錯誤或某事。是啊！ – 2013-02-09 08:02:56

另一件事是，如果有兩個輸入，它應該提醒三次。它不是。參見：http://jsfiddle.net/5QAS2/1/所以，我認爲它是一個錯誤。我們不能說它冒泡了DOM。那麼，我建議你「回報虛假」，當你編寫程序的時候。 – 2013-02-09 08:09:57

$("label.lol").off("click").on(//...

，但如果它的發動兩次它肯定意味着你必然就那麼兩次使用.off是不是你的問題，這將是瞭解你是如何結束這個事件綁定兩次的最佳解決方案更多的是黑客.. 。&想必您展示這些代碼並不能解釋這種雙重束縛

編輯：&你撥弄它的確引發只有一次......

來源

2013-02-08 15:24:19 mikakun

你可以嘗試使用標籤的「爲」屬性掛靠到外面的選擇。見我的例子

<label for="test" class="lol"> 
    <div> 
     bla 
    </div> 
</label> 

<div style="display:none;"> 
    <select id="test"></select> 
</div>

http://jsfiddle.net/d8Ax7/1/

來源

2013-02-08 15:26:45

報價：「我如何修復此錯誤而未將」for「屬性添加到標籤？」 – sofl 2013-02-08 15:27:45

啊，對不起，然後只是從你的處理程序中返回false：http://jsfiddle.net/d8Ax7/3/ – 2013-02-08 15:29:24

好吧，啊，你是誰更新你的答案？這很好。 @sofl總是在你的代碼中使用'return false;'。 – 2013-02-08 15:30:55

這樣，它也能工作，但我不完全理解你正在試圖做... 什麼，標籤應只包含一個標籤文本選擇與不包含選擇自己..

$("label.lol div:first").on({ 
     click : function() 
     { 
      alert(1); 
     } 
    })

來源

2013-02-08 15:27:11 soyuka

有特別重要的，當兩個選項中單擊檢查出更詳細的這個stack overflow問題，但概括起來試試這個...

$("label.lol").click(function() { 
     alert(1); 
     return false; 
});

來源

2013-02-08 15:29:33 cameronjchurch

你的標記是可怕的..你的問題是，jquery是在你的標籤函數內的每個div上執行單擊事件 - 意味着兩次。你應該清理你的標記並詢問你想直接點擊的div。否則使用方法：首先要確保事件僅觸發一次：

$('.lol div:first').click(function() 
{ 
    alert("1"); 
})

來源

2013-02-08 15:29:50 gulty

你是對的標記。但事件在標籤上燃起。嘗試用'alert（this）'替換'alert（「1」）'，你會看到它顯示'[object HTMLLabelElement]'兩次。 – fragmentedreality 2013-02-08 15:45:56

您應該添加e.preventDefault（）;

$("label.lol").on({ 
    click : function (e) 
    { 
    alert(1); 
    e.preventDefault(); 
    } 
});

來源

2013-02-08 15:31:20 Kaeros

你的問題是你的區分元素。g您應選擇標籤的第一個孩子:first-child選擇，或給它一個id：

HTML：

<label class="lol"> 
    <div id="first-child"> 
     bla 
    </div> 
    <div style="display:none;"> 
     <select></select> 
    </div> 
</label>

JS：

$("#first-child").on('click',function(){ 
     alert(1); 
});

http://jsfiddle.net/d8Ax7/5/

來源

2013-02-08 15:44:18 Ramin

嘗試用CSS過濾：添加一個int中級clicked，它可以防止第二次警報（或任何操作），並且可以刪除.clicked以準備好下一輪。

$("label.lol").on({ 
    click : function() 
    { 
     if (! $(this).hasClass('clicked')) 
      alert(1); 
     $(this).toggleClass('clicked'); 
    } 
})

來源

2013-02-08 16:01:05 fragmentedreality

jquery綁定點擊標籤發射兩次

回答

相關問題