首页 > 解决方案 > JavaScript removeAttribute("readonly") 不起作用

问题描述

所以我是 JavaScript 新手,我想做的是从一些文本输入字段中删除属性 readonly 。我的代码正在运行,但是正在发生的事情是只读删除了 1 秒,然后又返回只读状态。下图将解释我想说的(因为我的英语很糟糕) 在此处输入图片描述

这是我的代码:

    <form name="editForm" method="post" class="edit">
  <script>
  function ro(i) {
    document.getElementById(i).focus();
    document.getElementById(i).select();
    document.getElementById(i).removeAttribute("readonly");
  }
</script>
  <p>First Name:</p>
  <input id="i1" type="text" name="fname" readonly> <button onclick="ro('i1')"> Edit </button>
  <p>Last Name:</p>
  <input id="i2" type="text" name="lname" readonly> <button onclick="ro('i2')"> Edit </button>
  <p>Username:</p>
  <input id="i3" type="text" name="username" readonly> <button onclick="ro('i3')"> Edit </button>
  <p>Password:</p>
  <input id="i4" type="password" name="password" readonly> <button id="e4" > Edit </button><br>
  <!--<input type="password" name="cpassword" placeholder="Confirm Password" required>-->
  <input type="submit" name="signup" value="Sign Up">
</form>

标签: javascripthtmlfunctiondomreadonly

解决方案


这些按钮实际上刷新了页面,所以 readonly 回来了。添加type='button'到按钮。


推荐阅读