1

我有一个使用 FormData 提交的 jquery 表单(如果 formdata 不可用,则使用 iframe)但是当提交表单时会生成另一个表单。由于此表单将使用 jquery 函数提交,因此 jquery 函数似乎没有与表单绑定,因此而不是使用 event.stopDefault(); 它提交到它的默认值,即 test.php

换句话说,我的问题是:当 ajax 加载表单时,是否有方法/方式将 jquery 函数重新加载/绑定到新表单?

示例代码:

我试过的js代码:

$(document).on('#resize', submit, function(e) {
            e.preventDefault();
            e.stopPropagation();
            if(window.FormData === undefined){
                alert("Form Data not supported");
            }
            else{
                var iframe = $('<iframe name="resizeiframe" id="resizeiframe" style="display: none" />');

                $("body").append(iframe);

                var form = $('#resize');
                form.attr("action", "resizer.php");
                form.attr("method", "post");
                form.attr("enctype", "multipart/form-data");
                form.attr("encoding", "multipart/form-data");
                form.attr("target", "postiframe");
                form.attr("file", $('#resizeimage').val());
                form.submit();

                $("#resizeiframe").load(function () {
                    iframeContents = $("#resizeiframe")[0].contentWindow.document.body.innerHTML;
                    $("#textarea").html(iframeContents);
                    $("#resizeiframe").remove();
                    $(document).find('#resizeiframe').remove();
                });
            }


});

由ajax生成后提交但无论如何都提交的表单:

<form id="resize" action="resizer.php" method="post" onsubmit="return checkCoords();">
                <input type="hidden" id="x" name="x" />
                <input type="hidden" id="y" name="y" />
                <input type="hidden" id="w" name="w" />
                <input type="hidden" id="h" name="h" />
                <input type="hidden" id="resizeimage" name="image" value="'.$new_name.'"/>
                <input type="submit" value="Crop Image" class="btn btn-large btn-inverse" />
            </form>

ps 我已经尝试删除 onsubmit 但这并没有什么不同。

4

2 回答 2

2

如果它是动态加载的,则 jQuery 无法使用默认x.submit()函数绑定到它。

使用这样的东西:

 $(document).delegate('#id_of_my_dynamic_form', 'submit', function(e) {
     e.preventDefault();
     // now you have the form
     // maybe serialize the form

     // var s = $(this).serialize();
 });
于 2013-09-10T15:13:40.007 回答
0

只需将您的第一行更改为:

$(body).on('submit', '#resize', function(e) {

您需要绑定到存在的元素pageLoad

于 2013-09-10T20:58:35.910 回答