一键单击后如何使HTML按钮标记不可单击? [英] How do I make a HTML button tag unclickable after one click?

问题描述

当前分配了创建网站的任务，该网站使用python可视化网络.这样，单击按钮后，python脚本将运行用户设置的特定参数.为了避免巨大的负载请求，我们只希望用户单击一次按钮，而不能多次运行脚本.我们想到的想法是先单击一次按钮，然后在一个请求之后变为禁用状态(直到他们刷新页面，尽管我知道他们可以再次运行它，但是一旦到达那里，我们将讨论该问题. ).目前，我们也使用锚标记使用PHP来调用python脚本.我相信，由于我们使用的是定位标记，因此我们可能必须更改定位标记的href属性，以使其不会多次运行python脚本，即使按钮可单击也无济于事.

Currently assigned the task of creating a website which uses python to visualize a network. With this, after clicking a button, the python script will run off of specific parameters the user sets. To avoid a huge load request, we only want the user to click the button once, and not be able to run the script multiple times. The idea we came up with was having the button be clicked once, and then after the one request, become disabled(until they refresh the page, although I know they can just run it again, but we will discuss that problem once we get there). We are currently using an anchor tag to call upon the python script using PHP as well. I believe that since we are using an anchor tag, we may have to change the href attribute of the anchor tag so that it just doesn't run the python script numerous times, making the button useless even if its clickable.

我们尝试使用JavaScript函数:

We've tried using JavaScript functions:

let toggleVisual = false;

let hideVisual = function() {
  let visual = document.getElementsById('visual');

  if (toggleVisual = false) {
    visual.disabled = true;
    toggleVisual = true;
  }
}

更多JavaScript:

and more JavaScript:

document.getElementById('form-button').onclick = function () {
    this.disabled = true;
}

甚至是一些HTML:

<a href="?run=true" onclick="return false;"><button  id="form-button" class="visualize-btn">Visualize</button></a>

调用python脚本的PHP代码:

PHP code calling python script:

   <?php
   if (isset($_GET["run"])) {
      $output = shell_exec('sh test.sh');
      echo "<pre>$output</pre> works";
    }
   ?>

我希望当我单击按钮来运行脚本时，该按钮(或定位标记)将被禁用，以确保python脚本不会多次运行.

I expect that when I click the button to run the script, the button (or anchor tag) will become disabled, ensuring that the python script won't run multiple times.

推荐答案

欢迎使用StackOverflow！您已经快关门了.查看 onclick()事件，您可能会喜欢它.根据您的第一次尝试，一个简单的代码将类似于:

Welcome to StackOverflow! You were close.. Check out the onclick() event, you'll probably like it. A simple code based on your first attempt would be something like:

<button id="form-button" class="visualize-btn" onclick="doSomething();">Visualize</button>

<script type="text/javascript">
var wasClicked = false;
function doSomething() {
    if(wasClicked) { return; }
    wasClicked = true;

   // Your code here
   alert('Hello world!');
}
</script>

祝您网站运气好！

这篇关于一键单击后如何使HTML按钮标记不可单击?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！