Question

我有两个输入表单。使用默认值将它们加载到浏览器中时，表单将被禁用。

我创建了一个启用输入表单onclick的脚本函数。然后，用户可以更改其中任何一种形式的值。

只要任何表单中的值不是默认值，两个表单都必须保持启用状态。如果用户更改输入表单中的值以使其恢复为默认值，则表单将再次自动禁用。

这里的问题是两个输入值必须不等于表单的默认值才能保持启用状态。我正在努力解决这个问题。

＆＃13;

function enable() {
  var x = document.getElementsByClassName("row")
  for (i = 0; i < x.length; i++) {
    x[i].disabled = false;
  }
}

var x = document.getElementsByClassName("row")

function check() {
  for (i = 0; i < x.length; i++) {
    if (x[i].value == x[i].defaultValue) {
      for (i = 0; i < x.length; i++) {
        x[i].disabled = true;
      }
    }
  }
}

＆＃13;

<table>
  <tr>
    <td onclick="enable()">
      <input class="row" type="text" value="click me" disabled onblur="check()">
      <input class="row" type="text" value="click me2" disabled onblur="check()">
    </td>
  </tr>
</table>

＆＃13;

Answer 1

一种可能的解决方案是：

http://jsfiddle.net/rgghoham/

role_id

Answer 2

function enable() {
  var x = document.getElementsByClassName("row")
  for (i = 0; i < x.length; i++) {
    x[i].disabled = false;
  }
}

var x = document.getElementsByClassName("row")

function check() {
  var edited=false;
  for (i = 0; i < x.length; i++) {
    if (x[i].value != x[i].defaultValue) {
      edited=true;
    }
  }
  if(edited)return;
  for(i=0; i<x.length; i++){
     x[i].disabled=true;
  }
}

<table>
  <tr>
    <td onclick="enable()">
      <input class="row" type="text" value="click me" disabled onblur="check()">
      <input class="row" type="text" value="click me2" disabled onblur="check()">
    </td>
  </tr>
</table>

所以你的意思是这样的？

编辑：所以我们要做的是创建一个布尔值来跟踪任何变化。你用嵌套循环做了一些奇怪的事情，这不是必需的。如果检测到更改，则编辑将为true。如果它们都相同，则将使用编辑的默认值（false）。

在第一个for循环之后，我们检查是否已经进行了编辑if(edited)如果已经编辑了，我们使用return来突破该函数。你也可以使用：

if(!edited){
    for(i=0; i<x.length; i++){
         x[i].disabled=true;
    }
}

但我觉得使用return更清洁一点。因此，如果未进行任何编辑（输入默认值），代码将继续并禁用所有字段。

Answer 3

这是另一种可能性。我冒昧地删除了for循环，因为它似乎有一定数量的输入。如果您选择这样做，那么它将应用于启用/禁用功能。调用enable（）或disable（）可能会使其更具可读性。

//declare default values here (optional)
    var default1 = "click me",
        default2 = "click me2";

//enable...
        function enable() {
          var x = document.getElementsByClassName("row")
          for (i = 0; i < x.length; i++) {
            x[i].disabled = false;
          }
        }

//disable...
        function disable() {
          var x = document.getElementsByClassName("row")
          for (i = 0; i < x.length; i++) {
            x[i].disabled = true;
          }
        }


        var x = document.getElementsByClassName("row")
        function check() {
          if (x[0].value == default1 && x[1].value == default2) {     //testing your conditions
            return disable();
          } else {
            return enable();
          }

        }

按输入启用/禁用表单

3 个答案: