jquery - jQuery表单插件双重提交发生

Question

我的页面上有两个容器：

<div id="foto_1"><span>Change foto</span><img src="" /></div>
<div id="foto_2"><span>Change foto</span><img src="" /></div>

并将表单插件 .ajaxSubmit() 包装在我自己的函数中：

function imgUpload(div_id) {

 $('#myimgForm').submit(function(e){

    e.preventDefault();

    $(this).ajaxSubmit(
    {
        target:  '',
        success: function(data) {  

        var new_data = data.split('.');
        var path = new_data[0]+'_sm.'+new_data[1];
        $('#foto_'+div_id+' img').attr('src', '');
        $('#foto_'+div_id+' img').attr('src', path);

        },
        resetForm: true

    }); 
    return false;
  });
}

然后我调用我的函数：

$('#foto_1 span').click(function(){

    imgUpload(1);
});

$('#foto_2 span').click(function(){

    imgUpload(2);
});

所以问题在于当我点击第二个容器时，.ajaxsubmit() 执行了两次。什么原因？我在点击之前尝试了 unbind('live')，还有简单的 bind() 和简单的 click() - 没有变化......请帮助

这是一个html表单：

<form method="post" enctype="multipart/form-data"  id="myimgForm" name="myimgForm" action="/save_image_form.php"> 
    <div id="imgForm_div">
        <div id="img_input"><input type="file" name="caret" /></div>
        <input type="button" id="cancel_img" value="Cancel" />
        <input type="submit" value="Upload" />
    </div>
</form>

Answer 1

你试过了吗

$('#myimgForm').submit(function(e){

    e.preventDefault();

    $(this).ajaxSubmit(
    {

另请注意，live()已弃用。