Question

我试图在克隆后更改按钮值但没有成功。

HTML code：

<ul id="list">    
</ul>

    <div id="wrapper">
      <table id="table1" width="600" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="171"><input type="button" name="btn" id="num" value="1"  padding='0'/></td>

          <td width="423"><label>Από:
            <input type="text" name="startpoli" id="startpoli" />
          </label></td>
        </tr>
      </table>
      <table id="table2" width="600" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="172">&nbsp;</td>
          <td width="422"><label>Προς:
            <input type="none" name="finalpoli" id="finalpoli" />
          </label></td>
        </tr>
      </table>
    </div>

脚本：

var er = document.getElementById('wrapper'); 
for(var n=0;n<3;n++){
  var li = document.createElement("li");
   var clone = $(er).clone();
   $(clone).find('#num').attr('id','num'+n);
   var id_num = 'num'+n;  
  $('#id_num').val(n);
  $('li').append(clone);
  document.getElementById('list').appendChild(li);

更改#id_num值既不会成功使用attr('value',n)也不会成功 prop('value',n)。我哪里错了;

Answer 1

解决方案：

第1步：将id s的元素更改为class个。如果克隆元素，请确保其子树不包含id，因为那时您复制id s，导致无效的html。建议：

<div class="wrapper">
  <table class="table1" width="600" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td width="171"><input type="button" name="btn" class="num" value="1"  padding='0'/></td>

      <td width="423"><label>Από:
        <input type="text" name="startpoli" class="startpoli" />
      </label></td>
    </tr>
  </table>
  <table class="table2" width="600" border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td width="172">&nbsp;</td>
      <td width="422"><label>Προς:
        <input type="none" name="finalpoli" class="finalpoli" />
      </label></td>
    </tr>
  </table>
</div>

第2步：让我们看一下脚本：

var er = document.getElementById('wrapper'); 
for(var n=0;n<3;n++){
  var li = document.createElement("li");
   var clone = $(er).clone();
   $(clone).find('#num').attr('id','num'+n);
   var id_num = 'num'+n;  
  $('#id_num').val(n);
  $('li').append(clone);
  document.getElementById('list').appendChild(li); 
  }

您不需要按id获取元素，因为它不再有id。您不应在文档中创建li。您应该将其放入list ul。您不应再找到id num的元素，而应该找到class num的元素。您应该确保使用正确的选择器，而不是引用硬编码为字符串的变量名称。您不应将克隆附加到所有li元素，而应添加到刚刚定义的li元素。将来编写结构化代码并调试是否有些可疑。

建议：

//I assume that you do this when a single wrapper element exists
var er = $('.wrapper'); 
for(var n=0;n<3;n++){
    //I create the li and add it to list as empty element. I will have it as a variable in the future
    var li = $("#list").append("<li></li>").find("li:last");
    //Cloning of er. It is a jQuery object already, so the $() is unnecessary
    var clone = er.clone();
    //I assumed that you do not need an id here, but if you need one, it can be easily added. For the sake of simplicity, I have set the value solely
    clone.find('.num').val(n);
    //I add the parsed clone to the newly created li
    li.append(clone);
}

第3步：考虑一下你的设计。你真的想在list之外的clone和list之外加一个html吗？对于解决方案来说，这不是太阻碍了吗？

jquery clone - 更改按钮值

1 个答案: