防止onclick發射

我正在解決html中的表單提交問題。請在下面的代碼防止onclick發射

<form id="form1"> 
<button id="btn1" onclick="clicked();">Submit</button> 
</form> 
<script> 
    $("#btn1").click(function (event) { 
     alert("event triggered"); 
     if(some_condition == true){ 
      // stop firing onclick method but it always submits the form 
      event.stopImmediatePropogation(); // not working 
      event.preventDefault(); // not working 
      event.stopPropogation(); // not working it's for bubbled events 
     } 
    }); 
    function clicked(){ alert("clicked me"); } 
</script>

看一看我想從連接到內聯onclick屬性射擊停止clicked()功能。我想運行我的jQuery點擊功能，如果出現問題，我不想觸發onclick，但它總是運行clicked（）函數。任何人都可以幫助我。任何幫助是極大的讚賞。

來源

2016-07-02 user3205479

是來自運行* first *的onclick屬性的'clicked（）'函數嗎？如果您使用的是jQuery，爲什麼還要使用內聯'onclick'屬性？使用'.click（）'函數綁定這兩個處理程序，並且首先綁定的任何一個處理程序都可以調用stopImmediatePropogation（）來阻止第二個處理程序運行。（或將它們組合成一個處理程序。） – nnnnnn

@nnnnnn對不起，但「onclick」是自動生成的代碼，我們不能刪除onclick事件，如果我們想附加事件通過jquery添加它們，但我們無法隨時刪除onclick並注意「onclick」事件處理程序最後運行 – user3205479

其中onxyz處理程序被調用相對於動態附加的處理程序從瀏覽器到瀏覽器不同，所以原來做之前，你的處理可能無法運行該命令。

爲了解決這個問題，您保存並刪除的onclick處理程序：

var btn = $("#btn1"); 
var clickHandler = btn[0].onclick; 
btn[0].onclick = false;

然後，在你的處理程序，如果你想被稱爲是函數，你怎麼稱呼它：

clickhandler.call(this, event);

實施例：

// Get the button 
 
var btn = $("#btn1"); 
 

 
// Save and remove the onclick handler 
 
var clickHandler = btn[0].onclick; 
 
btn[0].onclick = false; 
 

 
// Hook up your handler 
 
$("#btn1").click(function(event) { 
 
    alert("event triggered"); 
 
    if (!confirm("Allow it?")) { 
 
    // Disallowed, don't call it 
 
    alert("stopped it"); 
 
    } else { 
 
    // Allowed, call it 
 
    clickHandler.call(this, event); 
 
    } 
 
}); 
 

 
// The onclick handler 
 
function clicked() { 
 
    alert("clicked me"); 
 
}

<form id="form1" onsubmit="return false"> 
 
    <button id="btn1" onclick="clicked();">Submit</button> 
 
</form> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

來源

2016-07-02 08:14:26

正確。或者，更好的辦法是，轉儲inline'onclick'處理程序並使用單個函數，或使用jQuery綁定兩個函數。 – nnnnnn

@nnnnnn：的確如此。我假設這是代碼被添加到某些地方因爲某些原因他們不能更改該HTML。（令人驚訝的是，有多少問題就是這樣的。） –

是的，OP剛剛證實這是針對我在該問題下的評論的情況。 – nnnnnn

-1

嘗試event.stopPropagation() api docs

來源

2016-07-02 08:07:07 Vinay

它不會工作，其冒泡事件，而不是相同的元素 – user3205479

你註冊了兩個聽衆。 – Vinay

OP已經嘗試過'stopImmediatePropogation（）'，它將完成'stopPropagation（）'所做的一切以及更多。 – nnnnnn

如果條件爲真，則刪除「的onclick」屬性

if (some_condition == true) { 
    $("#btn1").removeAttr('onclick').click(function(event) { 
     alert("event triggered"); 

     //do something 
    }); 
} 


function clicked() { 
    alert("clicked me"); 
}

來源

2016-07-02 08:39:00 ningrixin

我分享一個快速的解決辦法不知道爲什麼你不能添加邏輯停止添加「的onclick =」點擊（）;」碼你正在說自動添加。

我建議你隱藏ID爲「btn1」的按鈕。添加樣式顯示：無。你不需要爲此準備好函數，但只需將按鈕btn1添加樣式屬性，或者如果這也不可能直接使用，那麼使用jQuery來完成該文檔。閱讀： How to change css display none or block property using Jquery?

然後添加一個新的按鈕，使用jQuery與ID爲「BTN2」的形式，並添加註冊BTN2點擊事件也是如此。在表單加載後執行此操作。

<form id="form1"> 
<div id="newbut"> 
<button id="btn1" onclick="clicked();">Submit</button> 
</div> 
</form> 

jQuery("#newbut").html('<button id="btn2">Submit</button>'); 
$(document).on('click', '#btn2', function(){ 
    // Your Code 
});

請參考下鏈接到如何註冊點擊事件的新按鈕：

Adding click event for a button created dynamically using jQuery jquery - Click event not working for dynamically created button

來源

2016-07-02 09:26:20 adang

你能不能做健康檢查，並在一個函數的點擊（）邏輯是什麼？即

<script> 
function clicked() { 
    if(some_condition == true){ 
     return; 
    } 
    alert("clicked me"); 
} 
</script>

來源

2016-07-02 11:12:35

防止onclick發射

回答

相關問題