如何使用Javascript在點擊時禁用HTML按鈕？
[英]How to disable HTML button on the click using Javascript?
問題描述
單擊我的按鈕后，應該將其禁用，並且在刷新頁面之前再也不要單擊它。 下面是我的代碼：
<html>
<head>
<script type="text/javascript">
function myButtonClicked()
{
alert("Has myButton got disabled? I need solution for this.");
}
</script>
</head>
<body>
<button type="button" id="myButton1" onclick="myButtonClicked()">Click ME</button>
<button type="button" id="myButton2" onclick="myButtonClicked()">Click ME</button>
<button type="button" id="myButton3" onclick="myButtonClicked()">Click ME</button>
</body>
</html>
在調用myButtonClicked函數之前，應將其禁用。 實際上，我想在此函數中編寫一個PHP腳本，它將從數據庫中獲取一些數據，這在實際環境中會花費一些時間。 這就是為什么我要禁用該按鈕。 我該如何實現？
7 個解決方案
解決方案1
3 已采納 2014-04-23 05:37:45
您可以this傳遞給函數：
<button type="button" id="myButton1" onclick="myButtonClicked(this)">Click ME</button>
<button type="button" id="myButton2" onclick="myButtonClicked(this)">Click ME</button>
<button type="button" id="myButton3" onclick="myButtonClicked(this)">Click ME</button>
那么您可以使用：
function myButtonClicked(el)
{
el.disabled = true;
}
$('button').click(function() {
$(this).prop('disabled',true);
});
解決方案2
1 2014-04-23 05:38:57
添加-
function myButtonClicked()
{
alert("Has myButton got disabled? I need solution for this.");
this.disabled = true;
}
解決方案3
1 2014-04-23 05:39:44
function myButtonClicked()
{
$(this).prop('disabled', true);
}
有幫助嗎？
解決方案4
1 2014-04-23 05:42:02
在調用teh函數時將您的元素作為參數
<button type="button" id="myButton1" onclick="myButtonClicked(this)">Click ME</button>
<button type="button" id="myButton2" onclick="myButtonClicked(this)">Click ME</button>
<button type="button" id="myButton3" onclick="myButtonClicked(this)">Click ME</button>
並將元素屬性“ disabled”設置為true
function myButtonClicked(obj) {
obj.setAttribute("disabled", true);
}
小提琴： http ： //jsfiddle.net/quJX8/
解決方案5
1 2014-04-23 05:43:52
$("button").click(function() {
$('#'+this.id).prop('disabled', true);
});
解決方案6
0 2014-04-23 05:51:08
您可以這樣禁用，這是可以自我解釋的：
<script>
function myButtonClicked(id)
{
alert("Has myButton got disabled? I need solution for this.");
$("#" + id).attr("disabled", true);
}
</script>
<body>
<button type="button" id="myButton1" onclick="myButtonClicked(this.id)">Click ME</button>
<button type="button" id="myButton2" onclick="myButtonClicked(this.id)">Click ME</button>
<button type="button" id="myButton3" onclick="myButtonClicked(this.id)">Click ME</button>
</body>
解決方案7
0 2018-02-27 22:08:15
有比重寫函數和傳遞“ this”更簡單的方法。 只需在onclick屬性中使用“ this”即可：
<button type="button" id="myButton1" onclick="this.disabled=true;myButtonClicked()">Click ME</button>
這將禁用它，但不一定在表單上顯而易見。 我喜歡使用：
<button type="button" id="myButton1" onclick="this.style.visibility='hidden';myButtonClicked()">Click ME</button>
哪個“消失”了，但它仍然在表單中保持其位置。
如果不需要占位符，則還可以使用：
<button type="button" id="myButton1" onclick="this.hidden=true;myButtonClicked()">Click ME</button>
如何通過在 jQuery 或 Javascript 中單擊按鈕來禁用旋鈕？
[英]How to disable a knob by a button click in jQuery or Javascript?
單擊按鈕javascript時如何禁用事件單擊外部按鈕
[英]how to disable event click outside button when click button javascript
當使用JavaScript單擊HTML上的按鈕時，如何使事件發生
[英]how to make an event happen when click a button on HTML by using javascript
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.