jquery - Select dynamically created element with on not working

Question

I know you have to use on delegation to select dynamically created element with jquery so I have used this:

$(".form_wrapper").on('change', '#imageSelect', function(){

However, this is not working and the function is not being carried out when #imageSelect is changed.

The markup is somewhat like this but I have taken a bit out for simplicity.

<div class="form_wrapper" id="upload">
    <form action="..." method="post" id="audioUpload" enctype="multipart/form-data">...</form>
    <form action="..." id="imageUpload" method="post" enctype="multipart/form-data">    
        <input type="file" name="img" value="Select an image" id="imageSelect" class="buttonClassic">   
        <input type="hidden" name="purpose" value="track">  
        <input type="submit">   
    </form>
</div>

Answer 1

您需要将 jQuery 设置逻辑包装在 document.ready 函数中。像这样：

$(document).ready(function(){
    // Setup logic goes here
});

还要确保在上面的脚本之前在页面上包含了 jQuery 脚本。