Question

我正在研究ajax 浏览器是谷歌浏览器。
当我点击提交时，我的浏览器提交表单，而不是提醒。这有什么不对？

    <html>
    <head>
    <script type="text/javascript" src="/cp/scripts/jquery-1.7.2.js"></script>
    <script language="javascript">
    $("#test").submit(function(){
    //$.post("test.php", this.serialize());
    alert('ok');
    return false;
    });
    </script>
    </head>
    <body>
    <form id="test">
    <input type="text" name="name">
    <input type="submit">
    </form>
    </body>
    </html>

Answer 1

执行脚本时尚未定义表单。将其包裹在$().ready事件中：

$(document).ready(function() {
    $("#test").submit(function() {
    //$.post("test.php", this.serialize());
    alert('ok');
    return false;
    });
});

我可以看到以下问题：“未定义什么？” 是：

...
# Hey, a script tag, let's wait, and load the resource.
<script type="text/javascript" src="/cp/scripts/jquery-1.7.2.js"></script>

# Hey a script tag!
<script language="javascript">
$("#test").submit(function(){
//$.post("test.php", this.serialize());
alert('ok');
return false;
});
</script>
# The script block has ended, let's parse the script
# ... *calls* $('#test'). ....

# Now, #test is defined. Too late...
<form id="test">
# ...

Answer 2

首先，确保在document.ready上执行该功能，然后不要忘记阻止submit事件的默认行为：

$(document).ready(function() {
    $("#test").submit(function(evt){
        evt.preventDefault();
        alert('ok');
        return false;
    });
});

在Chrome中jsFiddle进行了测试。

Jquery .submit没有使用chrome

2 个答案: