0

我有这个有标签的页面。例如,选项卡 1 中的内容作为默认内容加载。当我单击选项卡 1 时,它会加载如下内容:

 $('.options').load('index.php?viewfile='+filee+' .optionsPane', function(data) {
      //inside here i initialized tinymce because the page has tinymce contents.
}

在该选项卡 1 中有一个表格。我有一个 js 页面链接到包含所有功能的页面。我有这个代码。

  $(document).ready(function(){
      $('.bottommernuform').submit(function () {
        var idval = $(this).attr('id').toString();
        var idvalarr = idval.split("-");
        var region_name= idvalarr[idvalarr.length-1];
        var publish = $('#regionstate-'+region_name).val();
        var swap = $('#swapregion-'+region_name).val();
        var page_url = $('#page-'+region_name).val();
        $.post("index.php", { publish:publish , swap:swap, region_name:region_name}, 
                            function(data) {
                                //alert(data);

                        });

 return false;
});

当我在完全加载页面后单击表单提交按钮时,这非常有效。但是,如果我单击从 load() 加载内容的选项卡 1,$('.bottommernuform').submit()则不会被调用 .. 它会刷新整个页面。在单击选项卡 1 后,当我尝试将内容保存在 tinymce 中时,它也给了我一个错误。我怎样才能解决这个问题。请给我一个解决方案。非常感谢帮助!});

4

1 回答 1

2

这里有两个可能的问题。首先,加载内容.load()不会触发$(document).ready(),因此在$(document).ready()加载新代码后,您的任何代码都不会运行。

其次,当您使用静态事件处理时,例如:

$('.bottommernuform').submit(fn)

此事件处理程序仅对'.bottommernuform'首次安装事件处理程序时存在的对象有效。这意味着它将不会对将来加载的内容进行操作。

如果您正在动态加载内容,并且您希望以前安装的事件处理程序能够处理该新内容,那么您需要使用委托事件处理,如下所示:

$(staticParentSelector).on('submit', '.bottommernuform', fn);

此 jQuery 对象中的选择器必须是动态加载.bottommernuform对象的静态父对象(例如,在您的document.ready()代码运行时存在并且是所有对象的父.bottommernuform对象)。为获得最佳性能,它应该是尽可能接近目标且未动态加载的父级。

另外,请记住,要防止提交操作的默认行为,您应该return(false)从提交事件处理程序中。

注意:.on()在 v1.7 中被添加到 jQuery。对于 v1.7 之前的版本,您可以使用.delegate()which 类似地工作,但参数的顺序不同。

于 2012-04-19T11:37:27.707 回答