当前位置:  开发笔记 > 编程语言 > 正文

jQuery:表单返回"成功"需要重新绑定

如何解决《jQuery:表单返回"成功"需要重新绑定》经验,为你挑选了1个好方法。

一个简单的问题.我正在使用jQuery.forms.js插件.

我有一个表单发布到php页面并使用jSon返回数据.

返回的数据是新表单的代码(它替换用于发布信息的表单).新表单没有绑定到任何jQuery函数,因为它在页面加载时不存在.

那么,我怎样才能获得ajax表单来识别新表单,这样如果我需要第二次使用表单,它还使用jQuery函数?

// jQuery for submitting info to php doc and, on success, replacing the form 
$(document).ready(function() { 
    jQuery('form[id*=postOnline]').ajaxForm({ 
        dataType: 'json',
        success: function(data) { 
            $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow');
            bindNote(); 
         } 
    });
});



// ... code for entering data into database and then... $result = mysql_query( $sql ); if($result) { if($show == '1'){$val = 'remove from online'; $num='0';} if($show == '0'){$val = 'show online'; $num='1';} $return = "
"; print json_encode(array("rid" => $id, "formed" => $return)); } ?>

Paolo Bergan.. 6

最简单的解决方案是不使用jQuery的表单插件并手动完成,这真的不是很难:

$(document).ready(function() { 
    jQuery('form[id*=postOnline]').live('submit', function() {
        var formdata = $(this).serialize();
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            dataType: 'json',
            data: formdata,
            success: function(data) { 
                $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow');
                bindNote(); 
            }
        });
        return false;
    });
});

现在,由于您使用的是jQuery的新(1.3)live功能,因此您添加的与form[id*=postOnline]选择器匹配的任何表单仍将与此事件相关联.

或者,您可以打开jquery表单代码并查找其绑定的任何位置,并尝试对其进行修改以便使用它live.甚至另一种选择是包含函数中的接线,并在成功函数结束时调用它,如下所示:

function bindForm() {
    jQuery('form[id*=postOnline]').ajaxForm({ 
        dataType: 'json',
        success: function(data) { 
            $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow');
            bindNote();
            bindForm();
        } 
    });
}

$(document).ready(function() { 
    bindForm();
});

我认为它不是很整洁,但应该有效.



1> Paolo Bergan..:

最简单的解决方案是不使用jQuery的表单插件并手动完成,这真的不是很难:

$(document).ready(function() { 
    jQuery('form[id*=postOnline]').live('submit', function() {
        var formdata = $(this).serialize();
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            dataType: 'json',
            data: formdata,
            success: function(data) { 
                $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow');
                bindNote(); 
            }
        });
        return false;
    });
});

现在,由于您使用的是jQuery的新(1.3)live功能,因此您添加的与form[id*=postOnline]选择器匹配的任何表单仍将与此事件相关联.

或者,您可以打开jquery表单代码并查找其绑定的任何位置,并尝试对其进行修改以便使用它live.甚至另一种选择是包含函数中的接线,并在成功函数结束时调用它,如下所示:

function bindForm() {
    jQuery('form[id*=postOnline]').ajaxForm({ 
        dataType: 'json',
        success: function(data) { 
            $('#onlineStatus' + data.rid).html(data.formed).slideDown('slow');
            bindNote();
            bindForm();
        } 
    });
}

$(document).ready(function() { 
    bindForm();
});

我认为它不是很整洁,但应该有效.

推荐阅读
夏晶阳--艺术
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有