Question

我是javascript新手。我创建了一个页面，其中包含一个添加项和一个已禁用的取消好友按钮。每个按钮从注册页面获取数据ID。

添加按钮是指向提示框的链接。在提示框中输入的数据将被插入数据库。完成后，将启用取消好友按钮。在此之前，用户无法单击它。为了避免用户多次单击添加按钮，我在他们点击后添加了禁用选项。现在，我的问题是可以插入数据，但是无法单击取消好友按钮。我已经尝试了很多教程，但是还没有解决问题。谁能帮我解决我的问题？在此先多谢！下面是我的代码和表格。

<html>
  <script>
    function myFunction(form){
      var subject = prompt("Please enter Subject that want to study");
      var btn = document.getElementById("btn");
      var add = document.getElementById("add");
      btn.disabled=false;
      add.disabled=true;
      if (subject != null){
        form['subject'].value= subject;
        form['add'].value="request sent";
      }
      form.submit();
    }

  function unfriend(form){
    var btn = document.getElementById("btn");
    var add = document.getElementById("add");
    add.disabled=false;
    btn.disabled=true;
    add.value="Add friend"; 
  }
</script>
<body>
  <form method="post" id="form" enctype="multipart/form-data" autocomplete="off"> 
    <input type="hidden" name="id" value="<?php echo $row['register_ID'];?>" />
    <input type="hidden" id="subject" name="subject" data-uid=<?php echo $_SESSION['sid'] ;?>/>
    <td>
      <input type="submit" onclick="myFunction(form);" name="addfriend" data-type='addfriend' id="add" class="btn" value="add" onchange="document.getElementById('btn').disabled = false" />                  
      <input type="submit" value="unfriend" id="btn"  onclick="unfriend(form);" disabled="" />
    </td>
  </form>
</body>
</html>

Answer 1

通过以下方式禁用html按钮：

document.getElementById("Button").disabled = true;

通过以下方式启用html按钮：

document.getElementById("Button").disabled = false;

Answer 2

您的代码的问题是页面访问之间不会传输信息。因此，当您单击按钮时，页面将重新加载，信息丢失。您要么传输信息（在页面加载时，检查已发送或保存的内容并显示），要么不重新加载页面。

另一个问题是，要使用$_SESSION变量，在PHP中需要一个session_start()命令。

对于第二种解决方案，您只需不form.submit()并使用type=button而不是type=submit。

下面是第二种解决方案的示例（您可以通过其他方式，例如通过AJAX将信息传输到服务器）：

<?php session_start(); ?>
<html>
    <head>
        <script>
            function myFunction(form){
                var subject = prompt("Please enter Subject that want to study");
                var btn = document.getElementById("btn");
                var add = document.getElementById("add");
                btn.disabled=false;
                add.disabled=true;
            }
            function unfriend(form){
                var btn = document.getElementById("btn");
                var add = document.getElementById("add");
                add.disabled=false;
                btn.disabled=true;
            }
        </script>
    </head>
    <body>
        <form method="post" id="form" enctype="multipart/form-data" autocomplete="off"> 
            <input type="hidden" name="id" value="<?php echo $row['register_ID'];?>" />
            <input type="hidden" id="subject" name="subject" data-uid="<?php echo $_SESSION['sid'] ;?>" />
            <td>
                <input type="button" onclick="myFunction(form);" name="addfriend" data-type='addfriend' id="add" class="btn" value="add" onchange="document.getElementById('btn').disabled = false" />                  
                <input type="button" value="unfriend" id="btn"  onclick="unfriend(form);" disabled="" />
            </td>
        </form>
    </body>
</html>

按钮未在javascript中启用

2 个答案: