Question

我正在学习JS但却陷入了困境。 http://jsfiddle.net/h7vgxewL/我想要实现的是能够更改克隆输入中的值。问题出在这里：

document.getElementById("control-II-Art-list-line1").onkeyup = function() {
        document.getElementById("display-II-Art-list-line1").innerHTML = this.value;   
        }

如果我添加更多字段，我需要为新行复制，例如行和输入字段，ID为：

control-II-Art-list-line2

有没有办法怎么做？请检查小提琴，我想你会明白我的意思。谢谢你的建议。

Answer 1

使用jQuery和事件委托，这将是微不足道的。委托事件侦听器适用于将来添加的元素：

$('form').on('keyup', 'input', function(){
    $('#' + this.id.replace("control-", "display-")).html( this.value );
});

http://jsfiddle.net/h7vgxewL/3/

或者，在香草JS中：

document.forms[0].addEventListener('keyup', function(e){
   var targetid, targetElement;
   if(e.target.id){
        targetid = e.target.id.replace("control-", "display-");
        targetElement = document.getElementById( targetid );
        if( targetElement ){
            targetElement.innerHTML = e.target.value;
        } 
  }
});

http://jsfiddle.net/dd0w7skz/

克隆后实时填充输入

1 个答案: