jQuery不会在注入后的表单上触发事件

我正在使用jQuery 2.0.0，并且我有一个包含2个链接的基本页面。如果用户点击每个链接的链接，表单通过Ajax加载并注入容器。早些时候可以通过live()将事件绑定到将来的元素，但是现在应该可以用on()我想，但它不会触发submit事件，就好像在注入表单后注入脚本一样。作为浏览器，我使用的是Firefox 20jQuery不会在注入后的表单上触发事件

页：

<!-- Normal HTML5 head with jQuery loader //--> 
<a href="./login">Login</a> 
<!-- Normal HTML5 end //-->

<form id="login" action="./login"> 
    <label for="username">Username:</label> 
    <input type="text" name="username" id="username" /> 

    <label for="password">Password:</label> 
    <input type="password" name="password" id="password" /> 

    <input type="submit" value="Login" /> 
</form>

最后我的脚本：

$(document).ready(function() { 

    $('a').on('click', function(e) { 
     $('body').load($(this).attr('href')); 
     e.preventDefault(); 
    }); 


    $('#login').on('submit', function(e) { 
     e.preventDefault(); 

     // Some validation and as test if event is fired 
     alert("Fired!"); 
    }); 

});

来源

2013-05-07 David

[使用jQuery on（）连接点击事件不可能通过Ajax调用触发注入的HTML]（http://stackoverflow.com/questions/8756684/wiring-up-click-event -using-jquery-on-doesnt-fire-on-injected-html-via-ajax-c） – undefined 2013-05-07 22:46:39

'-1'这个问题没有显示任何研究工作。 – undefined 2013-05-07 22:47:27

我现在正在使用jQuery 2.0，并且没有'live（）'方法了。所以你发布的话题的答案似乎已经过时了。 – David 2013-05-07 22:58:36

我opened a bug on jQuery和似乎每个人都必须使用像this example on jsFiddle这样的活动代表团：

$('#inject').on('click', function(e) { 
    $('body').html('<form id="login" action="./login"> \ 
         <label for="username">Username:</label> \ 
         <input type="text" name="username" id="username" /> \ 
         <label for="password">Password:</label> \ 
         <input type="password" name="password" id="password" /> \ 
         <input type="submit" value="Login" /> \ 
        </form>'); 
}); 

$('body').on('submit', '#login', function(e) { 
    e.preventDefault(); 

    // Some validation and as test if event is fired 
    alert("Fired!"); 
});

来源

2013-05-16 11:57:04 David

jQuery不会在注入后的表单上触发事件

回答

相关问题