jquery新标签的功能

Question

我已经在javaScript函数中创建了一个新类型文件的输入，然后我有新的输入功能，但它不工作。我运行add（）函数并点击按钮

<button type="button" onclick="add()" class="btnReadMore btnLoginPage">BUTTON</button> 


function add() { 

$('#insert').append("<input class='class1' type='file' name='ImagesInText' value='' /><br />"); 

} 

$("document").ready(function() { 

$('.class1').on('change', function() { 
    alert('changed!'); 
}); 
}); 

如果我用HTML代码写这个输入，它就起作用了。

Answer 1

您需要调用add()方法，在您的代码中添加add()，以便文件输入元素可以添加到您的HTML页面，稍后选择文件时，它将显示警报消息。

function add() { 
 
$('#insert').append("<input class='class1' type='file' name='ImagesInText' value='' /><br />"); 
 
} 
 

 
$("document").ready(function() { 
 
    $('.class1').on('change', function() { 
 
     alert('changed!'); 
 
    }); 
 
}); 
 

 
add();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="insert"></div>

Answer 2

你也可以点击这里http://jsfiddle.net/NbGBj/

<input type="file" id="upload"> 

$("document").ready(function(){ 
    $("#upload").change(function() { 
     alert('changed!'); 
    }); 
}); 

Answer 3

你可以试试这个工作的例子。

$("document").ready(function() { 
 
    $('body').on('change', '.class1', function() { 
 
    alert('changed!'); 
 
    }); 
 
}); 
 

 
function add(){ 
 
    $('#insert').append("<input class='class1' type='file' name='ImagesInText' value='' /><br />"); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<div id="insert"> 
 
</div> 
 

 
<input type="button" onclick="add();" value="Add New" />