2

我有一个 id="yearbookorder" 的 div，它是隐藏的。在单击事件之后，会出现一个带有该 yearbookorder ID DIV 的颜色框。

在那个 div 中，代码如下：

<form id="yearbook_order" name="yearbook_order" action="yearbook/order" enctype="multipart/form-data" method="post">
    <input class="ordering" name="yb_email" value="" >
    <input type="submit" id="order" name="order" value="Send it!">
</form>

我有一个 jquery ajax 代码要提交，但是没有触发表单提交事件：

$(function()
    {
        $("#yearbook_order").submit(function(e){
        e.preventDefault();
        dataString = $("#yearbook_order").serialize();   
        $.ajax({
            type: "POST",
            url: "yearbook/order",
            data: dataString,
            dataType: "json",
            success: function(data) 
            {
                if (data.status == 'error')
                {
                    alert(data.message);
                    //$("#msg").html(data.message);
                }
                else
                {
                    //$("#msg").html(data.message);
                    alert(data.message);
                }
            }  
            });               
        });
    });

当我单击提交按钮时，表单未提交。但为什么？当我不在颜色框中而是在空白页上调用此表单时，它正在工作。隐藏的 yearbookorder DIV 有问题吗？

4

1 回答 1

1 
You are binding submit to the form before it exists. Bind the event to the document, and pass the form selector to .on:

$(document).on("submit", "#yearbook_order", function(e){
    // make ajax request here
});
于 2013-03-22T13:23:14.497 回答