Question

在阅读我的问题之前，全局问题是：我使用jQuery创建带有click事件的元素，并且在创建之前我已经为这些元素准备好了函数，但这些就绪函数只有在我创建这些元素时才能工作用手。

我在这个过程中使用了jQuery。

第一部分：

我有一个链接（#addBefore），其中包含一个使用insertBefore方法创建元素（文件输入字段）的click事件。

$(document).ready(function() {
    var num = 1;
    $("#addREA").click(function() {
        num = num + 1;
        if (num <= 4) {
           $("
        <div class='col-lg-8'>
           <div class='text-center'>
              <div class=''>
                  <img src='' class='FILE_REA" + num + " img-responsive'/>
              </div>
      <h4>Charger une autre image d'illustration...</h4>
      <input type='file' name='ctl00$MainContent$FILE_REA" + num + "' id='ctl00_MainContent_FILE_REA" + num + "'/>
             </div>
        </div>")
       .insertBefore("#addbefore");
        }
    });

}）;

在这个过程中，我每次创建一个与num。

连接的新id

第二部分：

我有一个功能，可以在输入中选择后预览每个图像

function readURL1(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function(e) {
            $('.FILE_REA1').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

$("#ctl00_MainContent_FILE_REA1").change(function() {
    readURL1(this);
});

我复制了这个函数四次，每次更改时，img className和输入id与我在第1部分中创建的那些：

在我看来这是合乎逻辑的，但是当我使用普通的html创建元素时，它并没有这样做，但是这样做并没有。

感谢您的帮助

如果我没有解释好我的问题，请回答我关于第一个的问题，谢谢。

请看这里的完整示例： http://jsfiddle.net/j5owj8p1/

Answer 1

我应该使用.on方法

将事件链接到要创建的对象

 $(document).on('change','#FILE_REA1',function(){
        alert("changed3");
        readURL1(this);
    });

这就是为什么id没有工作的原因谢谢，希望它能帮助别人。

由事件不起作用创建的就绪功能元素

1 个答案: