javascript - 使用ajax从同一页面提交多个表单

Question

我有一个页面，从我的数据库加载了一堆问题。

所有问题都有 2 种形式。

喜欢:

<div class="col-xs-6">
    <form method="post" action="" id="knowId-XXXXX-y">
        <input type="hidden" name="userKnewStatus" value="YES">
        <input type="hidden" name="knowId" id="knowId" value="#ID">
        <input type="hidden" name="knewStatus" id="knewStatus" value="1">
        <button class="btn btn-success dyk-btn" type="submit">
            Ja <i class="fa fa-smile-o fa-fw"></i>
        </button>
    </form>
</div>

<div class="col-xs-6">
    <form method="post" action="" id="knowId-XXXXX-n">
        <input type="hidden" name="userKnewStatus" value="YES">
        <input type="hidden" name="knowId"  id="knowId" value="#ID">
        <input type="hidden" name="knewStatus" id="knewStatus" value="0">
        <button class="btn btn-danger dyk-btn" type="submit">
            Nej <i class="fa fa-meh-o fa-fw"></i>
        </button>
    </form> 
</div>

要提交表单，我在 Jquery/ajax 中有以下代码。

<script type='text/javascript'>
    /* attach a submit handler to the form */
    $("form").submit(function(event) {

        /* stop form from submitting normally */
        event.preventDefault();

        /* get some values from elements on the page: */
        var $form = $( this ), 
            url = $form.attr( 'action' );

        /* Send the data using post */
        var posting = $.post( url, { knowId: $('#knowId').val(), knewStatus: $('#knewStatus').val() } );

        /* Alerts the results */
        posting.done(function( data ) {
        alert('success');
        });
    });
</script>

表单正在提交，但由于表单 ID 重复，第一个值始终发送到该行。

如何分配 jquery 从表单本身中选择 id？

我根本不喜欢 jquery，但我尝试插入“this”，但随后我收到了错误。

Answer 1

首先将 ID 属性更改为类，其中元素具有相同的 ID，正如有人已经说过的，ID 在您的页面上应该是唯一的。然后，您可以通过执行以下操作从单击的表单中获取该类:

$form.find('.knowId').val();