jquery - 在一页上处理多个表单

Question

HTML:

<form method="post" action="action=save&amp;id=239" id="save-form">
    <input type="text" value="0" name="views" /> <input type="submit" value="save plz" name="save" />
</form>
<form method="post" action="action=save&amp;id=862" id="save-form">
    <input type="text" value="3" name="views" /> <input type="submit" value="save plz" name="save" />
</form>
<form method="post" action="action=save&amp;id=12" id="save-form">
    <input type="text" value="2" name="views" /> <input type="submit" value="save plz" name="save" />
</form>

PHP:

if ($_GET["action"] == "save") {
    if (isset($_GET["id"]) && preg_match("/^\d+$/", $_GET["id"])) {
        $id = $_GET["id"];
        // update view count here
    }
}

jQuery:

$('#save-form').ajaxForm({
    beforeSubmit: function() {      
        //
    },
    success: function(data) {
        //
    }
});

我正在使用这个插件:http://jquery.malsup.com/form/#html

我现在意识到我的所有表单都共享相同的 ID save-form。此代码非常适合 save-form 的第一个实例。但我希望它对所有人都有效。这引出了我的主要问题:

如何修改当前的 jQuery/HTML 来处理每个单独的表单。

理想情况下，我应该有一个唯一的 ID，例如 save-form-239 和 save-form-862。但我不想为每个都编写 $('#save-form-239') 和 $('#save-form-262');表格..我能做什么？

Answer 1

即使我确定 dbaseman 的解决方案工作正常，通常最好避免多个元素具有相同的 ID，因为根据 HTML 规范它是无效的。

更简洁的解决方案是使用 class="save-form" 而不是 id="save-form"，然后执行 $(' .save-form').ajaxForm(...);