Question

我有一个动态添加行的表，它们具有动态使用，提交等不同的属性。我有一个带有自动完成功能的输入框，必须更改其余的输入框值。如何在没有固定name，id或class的情况下更改其值？

动态创建的行：

<tr>
  <div id="1">
    <div id="2">
      <input type="text" name="input1" id="input1" class="input1" />
    </div>
    <div id="3">
      <input type="text" name="input2" id="input2" class="input2" onkeyup="foo(this);"/>
    </div>
  </div>   
  <input type="text" name="input3" id="input3" class="input3" />
  <input type="text" name="input4" id="input4" class="input4" />
</tr>

JavaScript函数：

foo(node){
   //node.name is input2
   change input1.value;
   change input3.value;
   change input4.value;

};

我不能依赖函数的静态属性，它们必须在创建元素后传递。

Answer 1

如果你愿意使用jQuery，你可以这样做：

$(function(){
   $("#yourTable").on("keyup","INPUT",function(){
       $("INPUT").not(this).val($(this).val());
   });
});

JSFiddle：http://jsfiddle.net/b6nDX/1/

这会使所有字段更改为表格中任何字段中输入的内容。

注意：如果您只想使用一个“来源”字段，则需要缩小选择器的范围

Answer 2

这可以通过DOM属性实现。

示例：

foo(elem){
    elem.parentNode.parentNode.parentNode.parentNode.children[2].children[0].children[1].children[0].value = "";
    elem.parentNode.parentNode.parentNode.parentNode.children[5].children[0].value = "";
    elem.parentNode.parentNode.parentNode.parentNode.children[6].children[0].value = "";
    elem.parentNode.parentNode.parentNode.parentNode.children[7].children[0].value = "";
    elem.parentNode.parentNode.parentNode.parentNode.children[8].children[0].value = "";    
};

如何使用JavaScript函数以动态形式处理表单输入值

2 个答案: