在jQuery中，为什么我的$(this).next().removeAttribute不起作用

Question

我正在使用以下按钮进行文件上传表单："选择文件"、"上传"one_answers"添加其他文件"

当File Input（）更改时，我正在尝试删除Upload按钮的属性"disabled"。它适用于第一个上传按钮，但不适用于第二个上传按钮等等。。。为什么？

如果你能帮我的话，非常感谢。

我的jquery代码是：

$(document).ready(function() {
$('input[type=file]').change(function(){
    $(this).next().removeAttr('disabled');
}); 
$('.add').click(function() {
    var num = $('input[type=file]').length; 
    newNum = num + 1;
    if (newNum >= 4){
        $('.add').hide();   
        }
    $('#addanother').append("<form method='POST'>");
    $('#photo1').clone().attr('id','photo'+newNum).appendTo('#addanother');
    $('#upload'+num).clone().attr('id','upload'+newNum).attr('disabled','disabled').appendTo('#addanother');
    $('#addanother').append('</form><br />');
    });
});

我的html代码是：

<form method='POST' enctype="multipart/form-data">
<input type='file' class='fileinput' id='photo1'>
<input type='button' id='upload1' name='upload1' value='Upload' disabled='disabled'>
</form>
<div id='addanother'></div>
<input type='button' class='add' id='add1' value='Add file'>

Answer 1

一开始没有意识到您在修改DOM。

更换

$('input[type=file]').change(function(){
    $(this).next().removeAttr('disabled');
});

带有

$(document).on({
    change: function() {
        $(this).next().removeAttr('disabled');
    }
}, 'input[type=file]');

Answer 2

您正在动态添加第二个上传按钮，因此没有绑定事件处理程序。在以下语法中使用.on，

$(document).on('change', 'input[type=file]', function(){
    $(this).next().removeAttr('disabled');
}); 

和删除，

$('input[type=file]').change(function(){
    $(this).next().removeAttr('disabled');
});