在一个页面上处理多个表单

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(...);