Question

我正在使用以下按钮进行文件上传表单：“选择文件”，“上传”和“添加其他文件”

我正在尝试在文件输入更改（）时删除“上传”按钮的“已禁用”属性。它适用于第一个上传按钮，但不适用于第二个上传按钮等等... 这是为什么？

非常感谢你能帮助我。

我的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');
});

在jQuery中，为什么我的$（this）.next（）。removeAttribute不起作用？

2 个答案: