动态创建文件上传并将其附加到div元素但不起作用？

Question

我已经创建了动态文件上传元素并追加到div内容。 它被创建。 但事件不起作用。 我的东西DOM没有更新。 如果按上传按钮，我会收到警报消息。 如果我单击第二个上传按钮（动态创建），则没有收到警报消息。

我的代码：

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script><form id="form1" runat="server"><body>
 <div id="uploaddev">
    <input class="Clsfileupload" id="Attachement1" name="Attachement1" type="file" value="">
    <span id="ErrorId1"></span>
</div>

剧本：

<script>
var totalfile = 1;
var ObjectNames = "";
var FilesNames = '';
var currentid = '';
$(".Clsfileupload").click(function(e) {
    currentid = this.id;
    alert(currentid);
});
$("#uploaddev").change(
  function() {

      var objectName = currentid;
      var ErrorId = currentid.replace("Attachement", "ErrorId");
      var size = document.getElementById(objectName).files[0].size;
      var Name = document.getElementById(objectName).files[0].name;
      if ((Name.indexOf(".png") > 0) || (Name.indexOf(".jpg") > 0)) {
          if (size > 102400000) {
              $("#" + ErrorId).text("file size too large");
          }

          else if (ObjectNames.indexOf(objectName) < 0) {
              ObjectNames = ObjectNames + objectName;
              totalfile = totalfile + 1;
              $("#uploaddev").append("<br><input class='Clsfileupload' id='Attachement" + totalfile + "' name='Attachement" + totalfile + "' type='file' value=''><span id='ErrorId" + totalfile + "'></span>");

          }
      }
      else {
          $("#" + ErrorId).text("Invalid file name");
      }
  });

Answer 1

请对动态附加的元素使用event delegation 。

尝试，

$(document).on('click','.Clsfileupload',function(e) {
    currentid = this.id;
    alert(currentid);
});

[注意：您的问题可能是第12837个相同类型的问题之一]

动态创建文件上传并将其附加到div元素但不起作用？

问题描述

1 个解决方案

解决方案1
1 已采纳 2014-01-28 07:15:55

动态创建文件上传并将其附加到div元素但不起作用？

问题描述

1 个解决方案

解决方案1 1 已采纳 2014-01-28 07:15:55

解决方案1
1 已采纳 2014-01-28 07:15:55