简单的jquery不起作用

时间:2013-11-22 09:52:58

标签: javascript jquery

我是JavaScript和jquery的新手,想要在提交之前检查表单中的字段。但即使从How to do something before on submit?获取的简单示例也不起作用。我没有在Firefox中发出警报,也没有在webdeveloper的控制台中看到任何错误。见代码:

<html>
<head>

<script src="jquery.min.js"></script>
<script type="text/javascript">
$('#myForm').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});
</script>
</head>

<body>


<form id="myForm" action="foo.php" method="get">
   <input type="text" value="" />
   <input type="submit" value="submit form" />
</form>



</body>
</html>

当然在同一个文件夹中有“jquery.min.js”。

5 个答案:

答案 0 :(得分:3)

您需要在dom ready处理程序中添加脚本

jQuery(function () {
    $('#myForm').submit(function () {
        alert('Handler for .submit() called.');
        return false;
    });
})

答案 1 :(得分:1)

执行js代码时,html元素必须已经存在。要延迟代码策略,请使用上面的document.ready

<script type="text/javascript">
$(document).ready(function(){
  $('#myForm').submit(function() {
    alert('Handler for .submit() called.');
    return false;
  });
});
</script>

注意:语法$('#myForm').submit(function() {已弃用,可能应替换为$(document).on("submit", "#myForm", function() {或类似内容:)

编辑:也针对您的要求,请参阅有关e.preventDefault()的javascript文档,这对您想要的内容也很有用:)

答案 2 :(得分:1)

这也可以,在已添加到DOM的元素之后设置脚本:

<html>

    <head>
        <script src="jquery.min.js"></script>
    </head>

    <body>
        <form id="myForm" action="foo.php" method="get">
            <input type="text" value="" />
            <input type="submit" value="submit form" />
        </form>
        <script type="text/javascript">
            $('#myForm').submit(function() {
                alert('Handler for .submit() called.');
                return false;
            });
        </script>
    </body>

答案 3 :(得分:1)

您应该尝试e.preventDefault();而不是return false; E.g

$(function() { $('#myForm').submit(function(e) { e.preventDefault(); alert('Handler for .submit called.'); }); });

因为有些时候return false;可能对jquery

上的某些代码无效

答案 4 :(得分:0)

    <html>
    <head>
    <script src="jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    $('#myForm').submit(function() {
      alert('Handler for .submit() called.');
      return false;
    });
    });
    </script>
    </head>
    <body>
    <form id="myForm" action="foo.php" method="get">
       <input type="text" value="" />
       <input type="submit" value="submit form" onsubmit="submit" />
    </form>
</body>
</html>

演示:http://jsfiddle.net/kapil_dev/6Tf7Y/