移动包含动态创建的脚本标记的DOM元素

我在基于wiki的CMS中使用Fish Gadget(http://abowman.com/google-modules/fish/),需要将小工具从一个HTML元素重新定位到另一个HTML元素.(注意:鱼小工具就是一个例子 - 其他小工具也会出现问题.)

如果我使用小工具基类"ig_reset"直接重新定位小工具,那么一切正常.如果我尝试使用周围的包装器重新定位,那么小工具使用的iframe似乎会接管.不幸的是,我需要使用周围的包装器重新定位的灵活性.

这似乎与在DOM中移动SCRIPT标记有关.小工具动态创建脚本和样式标记.如果我从DOM中删除动态创建的脚本标记,然后将包装器重新定位到DOM中的另一个位置,则一切正常.如果我尝试将脚本标记移动到另一个DOM元素,则会出现原始问题.所以在DOM周围移动脚本标签似乎是原因 - 无论何时发生移动(甚至是后加载).

我想了解这里发生的事情导致框架接管页面,并且还找到比移除动态创建的脚本标记更好的解决方案.

我在这里进行测试:http://solidgone.com/jquery/google-gadget.html - 该演示使用jQuery,但我不认为这与jQuery有关...

每当您使用jQuery将脚本元素附加到页面中时,它将尝试执行它.因此,当您移动ig_reset(它只是一个表 - 没有脚本)时,它可以正常工作.当您尝试移动包含脚本的包装器时,脚本将被移动并重新执行.

我们正在努力在jQuery核心中解决这个重新执行问题,但目前正是这里发生的事情.

正如John Resig所说,这是一个jQuery问题.您可以通过替换处理程序来验证这一点

$("#with-wrapper").click(function () 
{
   $('.sidebar-content-wrapper').contents().appendTo($("#sidebar"));
});

避免使用jQuery方法实际移动每个元素:

$("#with-wrapper").click(function() 
{
   var sidebar = $("#sidebar")[0];
   $('.sidebar-content-wrapper').contents().each(function()
   { 
      // raw DOM method rather than jQuery's 
      //  appendTo() -> domManip() -> execute script blocks behavior
      sidebar.appendChild(this);
   });
});