「click」事件沒有得到觸發，由於「模糊」

要重現該問題，請在小提琴[1]，並按照下列步驟操作：「click」事件沒有得到觸發，由於「模糊」

點擊文本框
輸入一些值在其中
輸入值後，點擊「點擊我」按鈕。請注意，請勿點擊瀏覽器上的其他任何地方
您會看到「按鈕點擊」事件沒有被觸發。

的HTML代碼看起來是這樣的，

<div class="wrapper"> 
    <input type="text" id="input"/> 
    <div class="error">There is an error </div> 
    </div> 
    <button type="button" id="button">Click Me</button> 
    <div id="log">Logs</div>

爲同一的JavaScript代碼是：

$(function() { 
    $("input,button").on("click focus blur mousedown mouseup", function (e) { 
    $("#log").append($("<div/>").html(e.target.id + " " + e.type)) 
    var self = this  
    if (self.id === "input" && e.type=="blur") { 
     $(self).trigger("exit") 
    }  
    }) 
    $(".wrapper").on("exit", function() {   
     $(this).find(".error").hide() 
     $(this).find(".error").text("") 
    }) 
})

的問題是「鉻」和「火狐」重複性。這是「Chrome」中的一個知道的錯誤還是任何遇到類似問題的人？

理想情況下，按鈕上的點擊事件必須被觸發，但不知何故它不？我無法瞭解原因或可能的解決方法。

我不想使用的setTimeout（）推遲了「模糊」事件執行

[1] https://jsfiddle.net/cg1j70vb/1/

來源

2017-01-12 Rishi Mehta

這隻發生在第一次 –

是的，它只發生在第一次。此外，註釋以下行〜$（this）.find（「。error」）。text（「」）〜可以解決問題，但我需要了解原因 –

是的，我確實觀察到..可能是DOM重新繪製當你刪除錯誤文本。 –

這是對的，因爲blur發生的input您要刪除的error文本。這將button向上移動（可能是DOM重新着色），因此錯過了click

我刪除了錯誤消息，它工作正常。

$(function() { 
 
    $("input,button").on("click focus blur mousedown mouseup", function(e) { 
 
    $("#log").append($("<div/>").html(e.target.id + " " + e.type)) 
 
    if (this.id === "input" && e.type == "blur") { 
 
     $(this).trigger("exit") 
 
    } 
 
    }) 
 
    $(".wrapper").on("exit", function() { 
 
    $(this).find(".error").hide() 
 
    $(this).find(".error").text("") 
 
    }) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="wrapper"> 
 
    <input type="text" id="input" /> 
 

 
</div> 
 
<button type="button" id="button">Click Me</button> 
 
<div id="log">Logs</div>

來源

2017-01-12 09:31:25

我同意你的說法，'hide（）'函數導致按鈕同時點擊事件 – rachmatsasongko

是的，這是因爲按鈕的移動。感謝您的回答。 –

我認爲它是因爲你的錯誤消息的hide()功能。

我試圖刪除它，只是更換錯誤消息，它的工作原理。 Demo

來源

2017-01-12 09:34:02 rachmatsasongko

「click」事件沒有得到觸發，由於「模糊」

回答

相關問題