在页面内容被load（）加载后，页面没有调用Jquery函数

Question

我有这个页面，它有选项卡。说的内容，标签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; 
}); 

这个完美的作品，当我完全加载页面后点击表单提交按钮。但是，如果我点击标签1加载内容负载（）$('.bottommernuform').submit()没有得到调用..它刷新整个页面。更多的点击标签1后，当我尝试将内容保存在tinymce中时，它也给我一个错误。我怎样才能解决这个问题。请给我一个解决方案。非常感谢！ }）;

Answer 1

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

其次，当你使用静态的事件处理，如：

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

此事件处理程序将只运行了，在第一次安装了事件处理时存在'.bottommernuform'对象。这意味着它将不会在未来加载内容。

如果您dynammically加载内容，你想以前安装的事件处理程序与新内容的工作，那么你需要使用委派事件处理是这样的：

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

在此jQuery对象的选择必须是动态加载.bottommernuform对象的静态父对象（例如，在您的代码运行时存在的对象，并且是所有.bottommernuform对象的父对象）。为获得最佳性能，它应该是最接近目标的父对象，尽可能不会动态加载。

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

注意：.on()被添加到v1.7中的jQuery中。对于v1.7之前的版本，您可以使用.delegate()，它的工作方式相似，但参数的顺序不同。