Jquery表单提交两次

Jquery表单提交两次,jquery,forms,Jquery,Forms,我在同一个页面上有multilpe评论表单,当点击触发器时会在模式框中弹出。我遇到的问题是,如果您提交表单一次,文本区域中没有任何内容,就会抛出一个错误,您需要输入一条注释,到目前为止一切正常。现在,如果你输入文本并正确填写并提交,无论输入什么文本,都会提交失败尝试的次数,我不知道为什么 jquery: $(".add-comment") .button() .click(function() { $(this).closest('.comments').find('.f

我在同一个页面上有multilpe评论表单,当点击触发器时会在模式框中弹出。我遇到的问题是,如果您提交表单一次,文本区域中没有任何内容,就会抛出一个错误,您需要输入一条注释,到目前为止一切正常。现在,如果你输入文本并正确填写并提交,无论输入什么文本,都会提交失败尝试的次数,我不知道为什么

jquery:

$(".add-comment")
    .button()
    .click(function() {
    $(this).closest('.comments').find('.form-comment').submit(function() {
        $('.com-error').hide();
        $('.com-msg').hide();
        $.post('/do-comment.php', $(this).serialize(),
            function(data) {
                if(data.success)
                {
                    $('.com-msg').find('.info-msg').html(data.message);
                    $('.comments').find('.com-msg').slideDown().delay(2000).slideUp(500);
                }
                else
                {
                    $('.com-error').find('.error-msg').html(data.message);
                    $('.com-error').slideDown().delay(2000).slideUp(500);
                }
            }, 'json');
            return false;
    });
});
php

if (!$user->isAuthorized()) {
    header('Location: index.php');
}else{

$i= 0;
    $cmt = array();
    if($_POST){
        $cmt['bid'] = filter_input(INPUT_POST, 'bid', FILTER_SANITIZE_STRING);
        $cmt['uid'] = $user->getId();
        $cmt['msg'] = filter_input(INPUT_POST, 'comment', FILTER_SANITIZE_STRING);
        if(trim($cmt['msg']) == '') {
            $data['success'] = false;
            $data['message'] .= 'You must enter a comment';
            $i++;
        }elseif(strlen($cmt['msg']) > 500) {
            $data['success'] = false;
            $data['message'] .= 'Your comment is to long.';
            $i++;
        }

        if($i <= 0){
            if(insertComment($cmt)){
                $data['success'] = true;
                $data['message'] = 'Added your comment!';
            }else{
                $data['success'] = false;
                $data['message'] .= 'Error adding your comment';
            }
        }
        echo  json_encode($data);
    }
    unset($_POST);
}
形式

<div class="comments">
<div class="wrap">
';
if(!$user->isAuthorized()){
    $output .= '<center>You must be logged in to post comments</center>';
}else{
    $output .= '
    <form name="form-comment" class="form-comment" >
    <textarea name="comment" class="beat-comment"></textarea>
    <input type="hidden" name="bid" value="'.$id.'" />
    <br />
    <span class="fr"><button type="submit" class="add-comment">Add Comment</button></span>
    </form>';

    $output .= '
    <div class="com-msg">
        <div class="ui-widget">
            <div class="ui-state-highlight ui-corner-all" style="padding: 0 .7em;">
                <p>
                    <span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;"></span>
                    <div class="info-msg">
                    <!-- MSG FROM AJAX REQUEST IF PRESENT-->
                    </div>
                </p>
            </div>
        </div>
    </div>
    <div class="com-error">
        <div class="ui-widget">
            <div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
                <p>
                    <span class="ui-icon ui-icon-alert" style="float: left; margin-right: .7em;"></span>
                    <div class="error-msg">
                    <!-- ERROR MSG FROM AJAX REQUEST IF PRESENT-->
                    </div>
                </p>
            </div>
        </div>
    </div>
    ';
}

通常我会解释你的代码在做什么以及如何修复它,但我很累。给这个一个螺纹:

jQuery:

$('.add-comment').click(function(){
    var myForm = $(this).parent();
    $('.com-error').hide();
    $('.com-msg').hide();
    $.post('/do-comment.php', $(myForm).serialize(), function(data){
        if(data.success){
            $(myform).parent().find('.info-msg').html(data.message);
            $(myForm).parent().find('.com-msg').slideDown().delay(2000).slideUp(500);
        } else {
            $(myform).parent().find('.error-msg').html(data.message);
            $(myform).parent().find('.com-error').slideDown().delay(2000).slideUp(500);
        }
    }, 'json');
    return false;
});
<form class="form-comment" >
    <textarea name="comment" class="beat-comment"></textarea>
    <input type="hidden" name="bid" value="'.$id.'" />
    <br />
    <span class="fr">
        <input type="button" class="add-comment" value="Add Comment" />
    </span>
</form>
标记:

$('.add-comment').click(function(){
    var myForm = $(this).parent();
    $('.com-error').hide();
    $('.com-msg').hide();
    $.post('/do-comment.php', $(myForm).serialize(), function(data){
        if(data.success){
            $(myform).parent().find('.info-msg').html(data.message);
            $(myForm).parent().find('.com-msg').slideDown().delay(2000).slideUp(500);
        } else {
            $(myform).parent().find('.error-msg').html(data.message);
            $(myform).parent().find('.com-error').slideDown().delay(2000).slideUp(500);
        }
    }, 'json');
    return false;
});
<form class="form-comment" >
    <textarea name="comment" class="beat-comment"></textarea>
    <input type="hidden" name="bid" value="'.$id.'" />
    <br />
    <span class="fr">
        <input type="button" class="add-comment" value="Add Comment" />
    </span>
</form>



不要编辑和添加答案中的代码,只需点击正确答案旁边的大复选标记即可将其标记为答案。:)没问题,Birgit_B,但是就像MetalFrog说的,如果你想感谢我,请在答案旁边打个大勾。你的一切都检查过了……新来的,仍然感觉良好。弄明白如何发布代码很有趣,哈哈,谢谢!这是可以理解的。。。在SO上发布并不是最优雅的方式,但它确实有效。祝你的项目好运!