单击不是提交按钮后如何禁用html按钮

Posted 2023-02-22

【中文标题】单击不是提交按钮后如何禁用html按钮

【英文标题】：how to disable a html button after it has been clicked not a submit button

【发布时间】：2013-10-02 06:29:21

【问题描述】：

嗨，我有一个 html 按钮，当您按下它时，它应该会告诉您商店与您所在位置的距离，所以当您按下它时，它们现在会出现问题是因为它处于早期阶段，每次都会打印信息按钮被按下我现在想知道如何在按下一次时禁用它，然后在按下另一个按钮时重新激活它这不是提交按钮我的按钮代码是：

   <button onclick="getLocation()">Search</button>

任何帮助将不胜感激提前感谢

【问题讨论】：

期待这个问题的更多标签..

我的意思是您需要使用的脚本。javascript、jquery 等。

我不介意使用任何脚本 tbh，只要它在单击后禁用按钮并在单击辅助按钮时重新启用

【参考方案1】：

我觉得你很清楚..

在点击事件中调用你的 getlocation() 方法..

Working fiddle

代码

$( "#bind" ).click(function() 
   $(this).attr("disabled", "disabled");
   $("#unbind").removeAttr("disabled");
);
$( "#unbind" ).click(function() 
     $(this).attr("disabled", "disabled");
     $("#bind").removeAttr("disabled");
);

输出

【讨论】：

我试过这样做，但它没有工作功能只是停止工作，按钮仍然可以按下

这是我从你那里复制的代码，然后将我的函数放在需要它们的地方：$( "#bind" ).click(function(getLocation) $(this).attr("disabled", "disabled"); $("#unbind").removeAttr("disabled"); ); $( "#unbind" ).click(function(getLocation1) $(this).attr("disabled", "disabled"); $("#bind").removeAttr("disabled"); );

你试过我的小提琴了吗..你是否添加了 jquery 库引用。

是的，在页面顶部它所做的只是让我的屏幕变黑

你能做一个你的小提琴吗..我会为你解决这个问题

【参考方案2】：

这样做：

    <script type="text/javascript">
    var clicked = false;
    function disableMe() 
        if (document.getElementById) 
            if (!clicked) 
                document.getElementById("myButton").value = "thank you";
                clicked = true;
                return true;
             else 
                return false;
            
         else 
            return true;
        
    
</script>
<button type="button" id="myButton" onClick="return disableMe()" value="OK">

或者，您可以这样做： onclick="this.disabled=true"

【讨论】：

这两个都在按钮被点击之前禁用它

使用这个onclick="this.disabled=true"后如何改变点击的文字？

【参考方案3】：

有很多方法可以做到这一点。通常，您可以使用 JavaScript 来编辑属性。最好阅读此内容并询问您的编码是否有问题。

你应该在这篇文章中找到你需要的东西：How to disable html button using JavaScript?

【讨论】：

tbh 我拥有的编码都在工作我只是找不到任何适用于 html 而不是提交按钮的代码

如果你还没有，jQuery 是一个很好的 JavaScript 库，它让这一切变得更容易。学习如何禁用按钮应该不会花很长时间。只需在处理单击按钮的函数中将 disabled 设置为 true 即可。

我会，但我不是最有经验的 jQuery

【参考方案4】：

你可以试试这样的：

$('button').click(function()
  // Add functionality here, then...
  $(this).attr("disabled", true);   
);

【讨论】：

你刚刚发布的代码在它们被点击之前禁用了它们

如果实施得当，它不应该。在我的代码 sn-p 中，禁用按钮发生在单击事件处理程序中。因此，在实际单击之前不应禁用它。当然，您需要在禁用之前添加您的功能。编辑我的例子来说明。

是的，我尝试了这个并为我正在使用的功能进行了编辑，但在按下它们之前它仍然禁用了它们

【参考方案5】：

这可以通过多种方式解决，但最直观的方法很可能是向应用程序（这似乎是）提供它所处的状态。例如：

var locationSearched = false //global scope of the application
getLocation() 
  if(locationSearched) 
      //do nothing or inform user of the state + wait for alternative button click
   else 
      //execute the method and request to retrieve the location
      state = true
  

或者，这可以作为参数传递给方法。在我看来，这似乎有点不稳定。使用建议的解决方案，您可以执行与状态相关的逻辑行为，使其更具可扩展性。

【讨论】：

这不起作用它在按下按钮时停止运行该功能

没错。为此，显然必须实现一个以在按下其他按钮时更改 locationSearched 变量。

【参考方案6】：

也许这会奏效。使用 DOM

function myFunction() 
  document.getElementById("myBtn").disabled = true;