1

我最近才开始使用 JQuery 和 AJAX。我正在练习使用 JQuery 在表单提交时获取表单值,并使用 AJAX 通过 PHP 脚本处理数据。这一切都非常好,也就是说,直到我向页面添加另一个表单。无论我提交什么表单,页面上第一个表单的数据都会被提交。如何从正在提交的表单中仅选择表单和值?

这是我的代码:

<html>

<head>
<title> JQUERY and AJAX </title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<!-- JQUERY script to submit the form without page refresh !-->
<script>
$(document).ready(function() {

    $("form").submit(function() {

        var name = $("input#name").val();

        var dataString = 'name='+ name;
        $.ajax({  
            type: "POST",  
            url: "ajax_submit.php",  
            data: dataString,                       
        }); 

        $("input#name").val("");            

        return false; 

    });
});
</script>

</head>

<body>

<form name="form" action=""/>
    <input type="text" name="name" id="name" autocomplete="off"/>
    <input type="submit" name="submit" id="submit"/>
</form>

<form name="form" action=""/>
    <input type="text" name="name" id="name" autocomplete="off"/>
    <input type="submit" name="submit" id="submit"/>
</form>

</body>

</html> 

谢谢!

4

1 回答 1

3

你知道如何使用 css 选择器吗?您可以将 css 选择器用作 jquery 选择器。意思是,如果你给每个表单一个 id 属性,你可以像这样稍后选择它:

$('#the_forms_id').submit();

其中表单 id 是您为表单选择的 html 属性,如下所示

<form name="form" action="" id = "the_forms_id"/>

只需使用 php 设置不同的表单 ID

另外,请注意您可以使用几乎任何您能想到的 css 选择器,以及 jquery 特定的选择器。你可以在这里看到它们。

如果您不知道如何使用基本选择器,请使用指南。

如果您想选择一个动态创建的表单(就像您评论的那样),实现取决于添加表单的方式以及需要如何捕获它。您可以使用 php 动态地为它们提供不同的 ID(例如,使用计数器)。

此外,当存在一些元素时,您可以使用 jquery 选择器来选择第一个或最后一个元素(或任何其他元素)。查看:last 选择器

$('form :last').serialize().submit()
于 2013-07-07T21:02:41.610 回答