Question

我在此代码中找到表单的父级时遇到问题：

<li class="comment<?php echo $comment[id]?>">
    <div class="comment-content">
        <div class="comment-top">
            <div class="comment-nme">
                    <?php echo $comment[name]?>
            </div>
                <div class="comment-dt">
                    <?php echo $comment[dt]?>
                </div>
        </div>
        <div class="comment">
            <?php echo $comment[comment]?>
        </div>
        <a class="reply" href="#comment<?php echo $comment[id]?>">Ответить</a>
    </div>
    <div class="answer-form">
        <form method="post"  name="answer-form" class="ans">
            <textarea class="comment-textarea" name="comment"></textarea>
            <div class="a-comment-inputs">
                <input type="hidden" name="parent_id" value="<?php echo $comment[id]?>">
                <input type="hidden" name="status" value="new">
                <div class="a-comment-name">
                    Имя</br>
                    <input type="name" name="name" class="a-comment-name">
                </div>
                <div class="a-comment-email" >
                    Eмейл</br>
                    <input type="email" class="a-comment-email" name="email">
                </div>
            </div>
            <div class="comment-apply">
                <button value="submit" onclick="return sendDataChild();" class="answer-but">Добавить</button>
            </div>
        </form>
    </div>

    <?php if($comment[childs]){ ?>

        <ul class="commentsRoot<?php echo $comment[id]?>">
             <?php echo commentsString($comment[childs]) ?>
        </ul>

    <?php } ?>

</li>

我使用这个jQuery函数：

function sendDataChild() {
    var form = $('FORM[name=answer-form]');
    var data = form.serialize();
    $.ajax({
        type: "POST",
        url: "req.php",
        dataType: "json",
        data: data,
        cache: false,
        success: function (data) {
            form[0].reset();
        },
        error: function (xhr, str) {
            alert('Возникла ошибка: ' + xhr.responseCode);
        }
        //$("#messageModalDialog").text(resultStat).show();
    });
    return false;
};

但它会选择按钮单击时找到的每个表单。有人可以建议如何解决它吗？

Answer 1

一种可能的解决方案

<button value="submit" onclick="return sendDataChild(this);" class="answer-but">Добавить</button>

然后

//pass the clicked button reference then find the parent form of the button
function sendDataChild(btn) {
    var form = $(btn).closest('FORM[name=answer-form]');
    var data = form.serialize();
    $.ajax({
        type: "POST",
        url: "req.php",
        dataType: "json",
        data: data,
        cache: false,
        success: function (data) {
            form[0].reset();
        },
        error: function (xhr, str) {
            alert('Возникла ошибка: ' + xhr.responseCode);
        }
        //$("#messageModalDialog").text(resultStat).show();
    });
    return false;
};

Answer 2

在表单上绑定提交事件，并将对象传递给表单对象

$(document).ready(function(){
   $("form[name='answer-form']").on('submit', function(){

      sendDataChild($(this));

   });
});

function sendDataChild(form) {
    var data = form.serialize();
    $.ajax({
        type: "POST",
        url: "req.php",
        dataType: "json",
        data: data,
        cache: false,
        success: function (data) {
            form.reset();
        },
        error: function (xhr, str) {
            alert('Возникла ошибка: ' + xhr.responseCode);
        }
        //$("#messageModalDialog").text(resultStat).show();
    });
    return false;
};

如何找到父母？

2 个答案: