1

现在我知道这听起来很简单,但老实说我无法拨入。我在一个页面上有两个表格。我写了一些这样触发的表单验证函数:

$("form").submit(function(event) {
    event.preventDefault();
    checkRequired();
    checkLengths();
    checkFormats();
    checkErrors();
});

这太棒了,但是在函数内部,我无法$(this)识别<form>单击提交按钮的位置。

假设我alert($(this).attr('id'));checkRequired()函数中编写。它警告“对象,对象”。

如果我在函数中放置相同的代码$("form").submit(),它会返回我的表单 ID。

函数中的选择器是类似的东西$("input[type='text']"),但函数在所有输入上运行,而不仅仅是提交的表单中的那些。

使用的示例函数():

function checkFormats() {

    alert("Checking Formats...");

    $(".email").each(function(){

        alert("Checking Formats: Email...");

        var emailField = $(this).children("input[type='text']");
        var strEmail = emailField.val();

        if( strEmail.indexOf( "@" ) == -1 ) {
            alert("What the hell?");
        }

    });

}

我敢肯定,当我听到解决方案时,我会感到很愚蠢,但是,嘿,我太累了,哈哈……提前谢谢!

想也许$("form",this)可以把我带到某个地方?

4

3 回答 3

3

您不能将表单传递给方法吗?

$("form").submit(function(event) {
    event.preventDefault();
    checkRequired(this);
    checkLengths(this);
    checkFormats(this);
    checkErrors(this);
});

然后你就有了正确的上下文。您现在可以在指定表单的上下文中选择任何其他元素,类似于:

function checkFormats(theForm) {
    $form = $(theForm);

    alert("Checking Formats...");
    
    // Get emails from within the context of the current form.
    $(".email", $form).each(function(){

        alert("Checking Formats: Email...");

        var emailField = $(this).children("input[type='text']");
        var strEmail = emailField.val();

        if( strEmail.indexOf( "@" ) == -1 ) {
            alert("What the hell?");
        }

    });
}

替代方案 - 使用 JavaScript .apply

(正如Mike Robinson在评论中提到的那样)


$("form").submit(function(event) {
    event.preventDefault();
    checkRequired.apply(this);
    checkLengths.apply(this);
    checkFormats.apply(this);
    checkErrors.apply(this);
});

然后this在函数内部就变成了形式。您现在可以像这样使用它:

function checkFormats(theForm) {
    $form = $(this);

    alert("Checking Formats...");
    
    // Get emails from within the context of the current form.
    $(".email", $form).each(function(){

        alert("Checking Formats: Email...");

        var emailField = $(this).children("input[type='text']");
        var strEmail = emailField.val();

        if( strEmail.indexOf( "@" ) == -1 ) {
            alert("What the hell?");
        }

    });
}

演示- 使用.apply


Demo 使用了一个简单的 HTML 来自:

<form>
    <button type="submit">submit</button>
</form>

使用此脚本:

$("form").submit(function (event) {
    event.preventDefault();
    checkRequired.apply(this);
});

function checkRequired() {
    alert("This is of type: " + this.nodeName);
}
于 2013-01-28T21:53:04.710 回答
0

您需要的是每个表单元素的唯一名称。阅读 jquery 选择器,您可以在其中选择需要选择的表单

使用 ID

$('#form_id')

班级

$('.form1')

甚至是数组中的索引。

$('form:first')[0] $('form:last')

于 2013-01-28T21:54:10.480 回答
0

给表单一个 ID 并在 jquery 调用中引用它:

$("#form1").submit(function(event) {
event.preventDefault();
checkRequired();
checkLengths();
checkFormats();
checkErrors();
});
于 2013-01-28T21:50:35.750 回答