为什么jquery .live()可以在特定情况下工作，而on()不能

Question

我们正在使用jQuery 1.7.1，我们将在删除已弃用的live()函数后进行升级。我在这里和其他地方看到了很多关于live()和on()之间区别的问题。但是，我不明白为什么在我的特定情况下on()不能为事件侦听器绑定接受某个(静态)元素。根据文档和其他地方，理想的绑定是尽可能接近您的事件目标，即使"document"在所有情况下都有效。

首先，我没有改变DOM。我没有添加或删除元素，这是大多数问题中常见的问题。所有相关人员都在那里。

第二，这是HTML的基本(伪代码!)版本:

<div.container>
    ...
    <ul>
        <li>
            <div.a_static_parent>
                <form method="post" action="call_a_python_func">...
                    <input.a_static_child>
                    <submit /> ...</form>
                 ...non-form stuff...
            </div>
        </li>
        ...x however many items...
    </ul>
</div>

我们的代码实际上是检查两个值是否相同或不同，并根据这一点，将提交按钮设置为禁用或禁用(它可能已经改变颜色或警告'FOO!不过，还是一样的问题)。这是一个POST-only表单，而不是POST-REDIRECT-GET;没有页面刷新。我们只是在后面更新了一个值。

使用live()的jQuery旧代码:

$('.a_static_child').live('change blur',  function() {
    //alert('FOO!'); and other non-DOM-changing things      
});

使用on():

我们新的，每页加载一次的jQuery代码

$('.a_static_parent').on('change blur', '.a_static_child', function() {
    //alert('FOO!'); and other non-DOM-changing things      
});

一直有效，不管:

$(document).on('change blur', '.a_static_child', function() {
    //alert('FOO!'); and other non-DOM-changing things      
});

在中间的情况下，事件触发，直到我点击提交按钮。之后，使用on()而不是live()，在刷新页面之前，不会在该表单中触发进一步的事件(对于页面上的每个单独表单都是如此)。将处理程序移出到。container或document修复了这个问题，但由于表单提交不会以任何方式改变DOM，我不明白为什么我需要走那么远。

.a_static_child总是在。a_static_parent中，但并不总是在。container中，因为这个表单也会出现在对话框和框架等中。

谁能解释一下，当我使用on()时，点击提交是如何关闭事件的，如果确实是这样的话?或者发生了什么?我可以张贴更多的代码，如果需要，但我希望坚持基本的。

Answer 1

我刚刚复制了你的代码，实际上得到了它的工作，所以它必须是一个外部问题。下面是您的工作代码:http://jsfiddle.net/MGrwb/1/

<div>   
    <ul>
        <li>
            <div id="a_static_parent">
                <form method="post">
                    <input id="a_static_child" />
                    <button id="testButton">Test</button>
                 </form>
            </div>
        </li>
    </ul>
</div>
$(document).on('change, blur', '#a_static_child', function() {
    alert('FOO!');// and other non-DOM-changing things      
});
$('#testButton').click(function(e) {
   $('form').submit();
});
$('form').submit(function (evt) {
    evt.preventDefault();  
});