Question

我正在尝试创建一个表单，当您按下按钮时它将验证，如果验证成功，如果将调用一个函数，它将执行一些操作（将表单数据保存到本地存储等）。

问题是我无法获取submitHandler来触发该函数。这是我一直在努力的jsFiddle。

http://jsfiddle.net/JamesKrawczyk/xdo9nn48/

代码。

<script>
function fireifworked()
{
$('.testIfWorking').html('IT WORKED');
}

$(document).ready(function() {
    $("#form1").validate({
        rules: {
            field1: "required"
        },
        messages: {
            field1: "Please specify your name"

        },
         submitHandler: function(form) {
            fireifworked();
        }
    })



    $('#btn').click(function() {
        $("#form1").valid();
    });
});
</script>

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" />
</form>

<div>
    <input id="btn" type="button" value="Validate"/>
</div>

<div class="testIfWorking">
CHANGE THIS IS WORKING
</div>

Answer 1

按钮需要位于表单内，并且类型为submit，而不是button

<script>
function fireifworked()
{
$('.testIfWorking').html('IT WORKED');
}

$(document).ready(function() {
    $("#form1").validate({
        rules: {
            field1: "required"
        },
        messages: {
            field1: "Please specify your name"

        },
         submitHandler: function(form) {
            fireifworked();
        }
    })



    $('#btn').click(function() {
        $("#form1").valid();
    });
});
</script>

<form id="form1" name="form1"> 
    Field 1: <input name="field1" type="text" />
     <input id="btn" type="submit" value="Validate"/>

</form>




<div class="testIfWorking">
CHANGE THIS IS WORKING
</div>

Answer 2

缺少jquery选择器中的.，它应该是$('.testIfWorking').html('IT WORKED')

Answer 3

似乎jquery没有链接。

在jquery代码开始之前在标题中添加：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

有几种方法可以在您的网站上开始使用jQuery。你可以：

- 从jQuery.com下载jQuery库

- 包括来自CDN的jQuery，如上面的例子中的Google。

jQuery .Validate（）submitHandler无法正常工作

3 个答案: