Question

我的页面中有以下处理程序在Firefox中正常工作，但显然没有在IE8中附加，因为它将参数添加到URL中，并且不会使任何ajax调用服务器：

$('#editBox form').live('submit',function(event){
        var daId = $('#editBox #id').val();

        $.post(
            '/edit.php',
            {
                company: $('#company',this).val(),
                name: $('#name',this).val(),
                email: $('#email',this).val(),
                id: daId 
            },
            function(response){
                sel = 'tr#' + daId;
                $(sel).html(response)
                .animate({backgroundColor: 'yellow'},500)
                .animate({backgroundColor: 'white'},500);

                $(sel + ' td:nth-child(3)').addClass('lastCell');

            });

            $('#editBox').hide('fast', function(){
                toggleHider();
                $(this).remove();
            });

            updateSorting();                

            consoleMessage('User changes saved');

        return false;
});

如何在IE和FF中完成这项工作？

更新

我仍然无法正常工作。使用下面的Joel解决方案，这就是我所拥有的：

function BindSubmit()
{
    $('#editBox form').unbind('submit').bind('submit', function() {
            var daId = $('#editBox #id').val();

            $.post(
                '/webadmin/CDAdmin/editrep.php',
                {
                    company: $('#company',this).val(),
                    name: $('#name',this).val(),
                    email: $('#email',this).val(),
                    id: daId 
                },
                function(response){
                    sel = 'tr#' + daId;
                    $(sel).html(response)
                    .animate({backgroundColor: 'yellow'},500)
                    .animate({backgroundColor: 'white'},500);

                    $(sel + ' td:nth-child(3)').addClass('lastCell');

                });

                $('#editBox').hide('fast', function(){
                    toggleHider();
                    $(this).remove();
                });

                updateSorting();                

                consoleMessage('User changes saved');

            return false;
    });
}

以下是我尝试使用它的方法：

$tr.live('click',function(event){
        if ( $('#editBox').length ){
            $('#editBox').remove();
        }   

        var eb = $('<div>').attr('id','editBox');

        $('#startEditBox').children().clone(true).appendTo(eb);

        BindSubmit();

但它不起作用。现在，该事件未附加在FF或IE中。

Answer 1

submit不支持直播活动

来自http://docs.jquery.com/Events/live#typefn

目前不支持：模糊，焦点，鼠标中心，鼠标移动，更改，提交

和

.live（当前）支持所有事件的子集。请注意上面支持/不支持的事件的完整列表。

我和$.live("change")有同样的问题。它在FF中工作，但不是IE。我最终使用$ .change（）。

我建议使用$ .submit（）

每当新的form添加到#editBox

时绑定事件

$('#editBox form').submit(function(event){
  ..
});

<强>更新

确保在尝试绑定提交事件之前将editBox元素添加到Dom。

$tr.live('click',function(event){
  if ( $('#editBox').length ){
    $('#editBox').remove();
  }   

  var eb = $('<div>').attr('id','editBox');

  $('#startEditBox').children().clone(true).appendTo(eb);

  //add into the page somewhere
  $('#something').append(eb);

  //then bind the submit event
  BindSubmit();

Answer 2

JQuery 1.3.x中的提交事件不支持

live()。试试JQuery 1.4 RC 1。

如果升级不是一个选项，则每次向页面添加表单时都必须手动绑定提交事件。

E.g。

function BindSubmit()
{
    $('#editBox form').unbind('submit').bind('submit', function() {
        ...
    });
}

每次向BindSubmit()添加表单元素时都会调用#editBox。

Answer 3

我认为此链接可能会对您有所帮助。

http://groups.google.com/group/jquery-en/browse_thread/thread/4e6495e5c91cb596

http://www.pubbs.net/jquery/201001/23464/

jQuery：如何在Firefox和Internet Explorer中附加提交事件？

3 个答案: