Question

全部，我有以下代码：

$(document).ready(function() {
    $("#create_review").validate();
    $("#submit_review_link").click(function() {
      if ($("#create_review").valid()) {
        $("#create_review").submit(function() { // catch the form's submit event
            $.ajax({ // create an AJAX call...
                data: $(this).serialize(), // get the form data
                type: $(this).attr('method'), // GET or POST
                url: $(this).attr('action'), // the file to call
                success: function(response) { // on success..
                    alert("it is here");
                    $('#created').html(response); // update the DIV
                }
            });
            return false; // cancel original event to prevent form submitting
        });
      }
      return false;
    });
});

这是我的实际HTML表单：

<form action="save_review.php" method="post" name="create_review" id="create_review">
    <textarea name="review" id="review" rows="5" class="required"></textarea>
</form>
<a class="button-2" href="#" id="submit_review_link" onClick="submit_form()">Submit Review</a>

我正在尝试验证这一点，然后在我创建的div中显示结果。它不起作用，但我不确定为什么。任何想法将不胜感激。提前谢谢。

Answer 1

你是否认为.submit会提交表格？所做的就是为创建提交时设置一个处理程序。

在回调发生之前，您仍需要提交表单。

另外，我不熟悉“submit_form”方法。为什么不尝试使用普通表单提交按钮而不是链接

http://www.javascript-coder.com/html-form/html-form-submit.phtml

＆lt; input type ='submit'＆gt;＆lt; / input＆gt;

Answer 2

我实际上最终拆分了这些函数，新代码是：

$("#create_review").validate();
        $("#submit_review_link").click(function() {
          if ($("#create_review").valid()) {
            submit_form();
          }
          return false;
        });

    function submit_form(){
        data_to_send = $("#review_text").val();
        recipe_id_to_send = $("#recipe_id").val();
        current_reviews = $("#current_reviews").val();
            $.ajax({ // create an AJAX call...
                data: {review_info : data_to_send, recipe_id : recipe_id_to_send}, // get the form data
                type: "POST", // GET or POST
                url: "save_review.php", // the file to call
                success: function(response) { // on success..
                    update_reviews();
                    $("#review_text").val("");
                    $('#review_saved').prepend(response); // update the DIV
                    if(current_reviews==0){
                        $("#no_reviews").hide();
                    }

                }
            });
            return false; // cancel original event to prevent form submitting
    }

使用AJAX提交表单并在jQuery验证器之后将内容放在DIV中

2 个答案: