Question

我有javascript的问题，在我的HTML代码中：

<input onclick="myFunction();" />

<script>
function myFunction(){
 //excecution of this fucntion
}
</script>

单击输入后，该功能运行。但我想在第一次点击后禁用myFunction，所以当我再次点击时，myFunction将无法运行。

Answer 1

只需删除属性

即可

<input onclick="myFunction(this);" />

<script>
function myFunction(elem){
    // code here
    elem.removeAttribute('onclick')
}
</script>

甚至更好地使用事件监听器

<input id="myInput" />

<script>
    document.getElementById('myInput').addEventListener('click', myFunction, false);

    function myFunction(elem){
        // code here
        this.removeEventListener('click', myFunction);
    }
</script>

Answer 2

一种方法是在代码执行后将其设置为空函数。

function myFunction(){
   //(..) Some code
   myfunction = function(){}; // empty the function so nothing happens next time
}

Answer 3

如果你正在使用jQuery（因为你已将它包含在标签中），我会选择.one()：

<input type="txt" class="my-input" />

function activateClick(){
    // single click:
    $('.my-input').one('click', function(){
        // do stuff ...
    });
}

// Activate single click on input element 
// Can be reactivated later on, using the same function (see DEMO):
activateClick();

DEMO

Answer 4

使用布尔指示符确定该函数是否已运行。这种方法的优点是可以在以后轻松重置功能状态。

<!DOCTYPE html>
<html>
<body>
<button onclick='func();'>Function</button>
</body>
<script>
var funcActive=true;
function func() {
if (funcActive) {
funcActive=false;
alert('func ran');
}
}
</script>
</html>

禁用Javascript事件DOM中的函数

4 个答案: