在執行jQuery功能時禁用鼠標單擊事件

我想在焦點和焦點輸出文本字段時執行水平手風琴。爲了實現這一點，我使用jQuery動畫。它工作正常，但如果文本字段在完成動畫之前失去焦點，對齊將變得不正確。所以我想阻止鼠標點擊事件，直到完成jQuery函數/執行。在執行jQuery功能時禁用鼠標單擊事件

供您參考，這是我的代碼：

$(".container-inline input[type=text]").focusin(function() {  
    $("#page-wrap").width("720px"); 
    $("#my_search").width("171px"); 
    $("#myDiv").animate({ width: "150px" },{queue: false, duration: 1000}); 
}); 

$(".container-inline input[type=text]").focusout(function(){ 
    $("#page-wrap").width("720px"); 
    $("#my_search").width("171px"); 
    $("#myDiv").width("88px"); 
});

我怎樣才能解決這個問題？

來源

2013-07-25 Srinivasan.S

查找到[jQuery的BolckUI（http://www.malsup.com/jquery/得到幫助塊/） –

嘗試使用click事件處理程序，並使用preventDefault，stopPropagation和stopEvent組合（可能前兩個會起作用） – orion78fr

我認爲，您正在以錯誤的方向查看問題。阻止鼠標點擊事件，而是專注於對齊問題 – iamkhush

jQuery中有一種叫做promise的方法，可以用來檢查排隊的動畫是否已經完成。它可以使用類似下面的方式

$("div").promise().done(function() { 
    alert("Finished!"); 
});

否則我建議你有一個標誌變量來檢查動畫是否完成與否。如果動畫沒有通過檢查標誌變量結束，你可以將焦點放下。像下面這樣

var animationOver = false; 
$(".container-inline input[type=text]").focusin(function() {  
    $("#page-wrap").width("720px"); 
    $("#my_search").width("171px"); 
    $("#myDiv").animate({ width: "150px" },{queue: false, duration: 1000}); 
    animationOver = true; 
}); 

$(".container-inline input[type=text]").focusout(function(){ 
    if (!animationOver) 
     return false; 
    $("#page-wrap").width("720px"); 
    $("#my_search").width("171px"); 
    $("#myDiv").width("88px"); 
    animationOver = false; 
});

爲iamkhush說，我們沒有什麼可以阻止通過鼠標點擊:(

來源

2013-07-25 10:51:06

首先感謝你的迴應。我使用jQuery stop（）函數修復了對齊問題。 –

，但請注意，stop（）將停止動畫並且不將元素返回到其原始位置，如果動畫的某些部分已完成，則必須處理此情況。 –

在執行jQuery功能時禁用鼠標單擊事件

回答

相關問題