Question

为什么此表单验证无效？我是这样做的：

<form name="myForm" action="save-info.php" method="post" onsubmit="return(validu());">

http://jsfiddle.net/QrYmh/41/

我正在尝试向表单添加验证功能，但即使直接返回false也不起作用。表格仍然提交有什么问题？

我需要为我的输入添加一些验证逻辑。但我似乎无法做到这一点。 js调试器（firefox）表示ReferenceError：validu未定义

请帮忙

Answer 1

由于您已经在使用jQuery，因此您也可以使用submit() method可用。

检查this fiddle：

$(document).ready(function () {
    $('form').submit(function (e) {
        e.preventDefault();
        alert('vdsdsfsdf');
        //validate and submit.
    });
}

Answer 2

为了能够从function属性引用on*，必须在全局范围内定义它。

目前在另一个validu()内宣布function，onsubmit属性根本无法访问它。

使validu()全局：

移除$(document).ready(function () { })周围的function validu()。
[旁注] .ready()事件不仅仅适用于function声明。当您需要从document：
中选择元素时，它们非常有用
```
function handleSubmit(event) {
    // ...
}

$(document).ready(function () {
    $('form[name="myForm"]').submit(handleSubmit);
});
```
将onLoad的JSFiddle选项更改为：{/ 1>}，它将您的代码包装在另一个function中：
- No wrap - in <head>
- No wrap - in <body>

或者，正如karthikr建议的那样，您也可以使用unobtrusive JavaScript而不是onsubmit属性，因此事件绑定和function可以在同一范围内。

$(document).ready(function () {
    function validu() {
        alert('vdsdsfsdf');
        return false;
    }

    $('form[name="myForm"]').submit(validu); // <----
});

Revised Fiddle

Answer 3

函数validu（）必须可以通过html代码访问。在这种情况下，它只能在jquery ready函数中访问。

不幸的是，不可能简单地将它放在jsfiddle中的ready函数之外以使其工作，因为jsfiddle本身将js代码放在窗口加载函数中。所以你必须这样写，

<script>function validu()
{
    alert('vdsdsfsdf');
    return false;
}</script>
<form name="myForm" action="save-info.php" method="post" onsubmit="return(validu());">

<div class="container" style="width:700px; margin:0 auto;"> 
<fieldset>
.....

http://jsfiddle.net/QrYmh/52/

JavaScript表单验证无法按预期工作

3 个答案: