0

这是场景 - 我有一个页面，其中有一个打开 jQuery UI 对话框的链接。对话框中有一个小表单（用于上传图像）。“动作”页面处理并返回图像，该图像旨在返回到对话框。

现在，这一切都按预期工作-但是，由于某种原因，它被处理了两次。从视觉上看，没有任何迹象表明它被提交和处理了两次（我只知道是因为我使用的是 Firebug，并且我试图弄清楚为什么它的处理时间比预期的要长）。

在这里查看以前的答案，建议 jQuery 代码应该在对话框之外 - 但它已经是。我已经用尽了我现在能想到的所有途径。我是 JS/jQuery 的新手，所以我完全有可能遗漏了一些简单的东西。无论哪种方式，指针表示赞赏！我的代码如下...

 <head[...]>
 <script>
 $(function() {
 $('#submitImage').bind('click', function(){
    $(".preview").html('');
    $(".preview").html('<img src="/images/elements/loaders/103.png" alt="Uploading...." style="text-align:center;"//>');
    $("#imgadd").ajaxForm({
    clearForm: 'true',
    target: '.preview'
    }).submit();
});
});
 </script>

[......页面的其余部分......]

 <!-- Dialog -->

 <div id="customDialog" class="customDialog" title="Upload or Insert Image">

 <form id="imgadd" action="a_blogimgupload.cfm" method="post" enctype="multipart/form-data">
 <input type="file" class="fileInput" name="blogimg" />&nbsp;<input type="submit" id="submitImage" value="Upload" /></form>

 <div class="preview">
 <ul>
 <li><img src="imgthumb.png" alt="" /><a href="javascript:;" title="Insert" onclick="addImage('imgfull.png');return false;">Insert</a></li>
</ul> 
</div>
4

2 回答 2

1

谢谢李。我的在 IE 中多次发帖。我现在也在 IE 中工作。发布我的一些javascript....

$(document).ready(function () {
$("#uploadSubmit").button().click(function (e) {
    submitUploadForm();
    e.preventDefault();
    return false;
});

});

function submitUploadForm() {
$(function () {
    $('#reportOptions').ajaxForm({
        success: SubmitSuccesful,
        error: AjaxError,
        type: 'post',
        cache: false,
        url: baseHref() + 'Upload'
    }).submit();
});
}
于 2013-03-29T15:11:57.727 回答
1

您.ajaxForm习惯于准备表格以使用 ajax 发送。您使用它的一个 - 该表单的每次提交都将使用 AJAX 完成。因此，您必须将代码移到外部点击下方

$("#imgadd").ajaxForm({
    clearForm: 'true',
    target: '.preview'
    })

（此外，您不需要在单击处理程序中调用 .submit() ，因为它已经导致提交）或者，您可以像这样更改代码：

$('#submitImage').bind('click', function(e){
    $(".preview").html('');
    $(".preview").html('<img src="/images/elements/loaders/103.png" alt="Uploading...." style="text-align:center;"//>');
    $("#imgadd").ajaxForm({
    clearForm: 'true',
    target: '.preview'
    }).submit();
    e.preventDefault();
});

哪里e.preventDefault()（好吧，从来没有尝试过这样的事情，也许你还需要做 e.stopPropagation()，但我不这么认为）将阻止浏览器执行默认操作，即提交。但最好是在这里做第一件事。

此外， .ajaxSubmit()它接受与 ajaxForm 相同的选项，但它也会导致立即提交。但是，如果您将使用它 - 您将需要删除.submit并且 e.preventDefault仍然是必需的。

于 2012-09-17T20:08:03.943 回答