Question

我有一个使用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>

p.s我试图删除onsubmit，但这没有什么区别。

Answer 1

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

使用类似的东西：

 $(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();
 });

Answer 2

只需将第一行更改为：

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

您需要绑定到pageLoad

上存在的元素

绑定jquery函数与页面后加载的表单

2 个答案: