Question

在我的HTML中

如果我将类型更改为文本它没关系，但是当我更改它时，类型文件没有任何反应，当我点击

<input type="file" name="pic[]" accept="image/*" >a
<input type="file" name="pic[]" accept="image/*" id="u_f">b<br>
<button type="button" class="btn btn-info" id="btn1">
 <span class="glyphicon glyphicon-plus"></span>
</button>

这是我的jquery

$(document).ready(function(){
    $("#btn1").click(function(){
        $("#u_f").append(" <input type='file' name='pic' accept='image/*' id='u_f' />b<br>.");
        // alert('hi');

    });

Answer 1

#u_f元素是input，因此您无法append()任何内容。如果您尝试添加其他文件输入，则可以使用insert()，insertAfter()或任何其他DOM插入方法：

$("#btn1").click(function() {
  $('<input type="file" name="pic" accept="image/*" />b<br>').insertBefore(this);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" name="pic[]" accept="image/*">a<br />
<input type="file" name="pic[]" accept="image/*">b<br />
<button type="button" class="btn btn-info" id="btn1">
 <span class="glyphicon glyphicon-plus">+</span>
</button>

另请注意，我删除了id属性，因为您最终会使用添加的内容复制它们，这会使HTML无效。

Answer 2

＆＃13;

$(document).ready(function(){
  $("#btn1").click(function(){
     $("#u_f").parent().append($("<input/>",{type:"file",name:"pic",accept:'image/*',id:'u_f'})).append("b<br>");
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" class="btn btn-info" id="btn1">
 <span class="glyphicon glyphicon-plus">+</span>
</button>
<hr>
<input type="file" name="pic[]" accept="image/*" >a<br>
<input type="file" name="pic[]" accept="image/*" id="u_f">b<br>

＆＃13;

Answer 3

您必须根据下面的行更改代码

 $("#u_f").append(" <input type=\'file\' name=\'pic\' accept=\'image/*\' id=\'u_f\' />b<br>.");

如何附加输入类型文件

3 个答案: