包装内容元素会导致内联脚本触发 [英] Wrapping content elements causes inline scripts to fire

问题描述

我正在编写一个jQuery插件。在这个插件中，我将包含 DIV 中现有的 BODY 内容，并将其隐藏。

  var $ originalBodyContents = $（'body'）。wrapInner（'< div>'）。 
  

然后插件附加自己的叠加层 DIV 到 BODY ，它是插件魔术。当用户退出插件时，将删除其覆盖 DIV ，并解开它们。

 <$ c $ 。C> $ originalBodyContents.children（）解开（）; 
  

这个工作很棒，你可以在这个演示中看到：

< a href =http://jsfiddle.net/vKddB/1/ =nofollow> http://jsfiddle.net/vKddB/1/

但是，如果页面上有内容脚本，那么当wrap发生时，它们都被重新加载，并且它们再次运行代码。这正在引发许多意想不到的行为，您可以在此演示中看到：

http： //jsfiddle.net/vKddB/3/

在上面的演示中，您会看到显示提醒按钮显示一条警告，表示你好！点击时。如果您启动插件并关闭插件，您会注意到显示提醒按钮现在有两个点击处理程序绑定，所以它点击时显示两个提醒。

我的插件无法控制正在运行的页面的内容。有一种方法可以防止内联脚本重新运行，当我将身体内容包裹在一个 DIV ？

I am writing a jQuery plugin. In this plugin I wrap the existing BODY contents in a DIV and hide them.

var $originalBodyContents = $('body').wrapInner('<div>').children('div').hide();

The plugin then appends its own overlay DIV to the BODY and does it's plugin magic. When the user exits the plugin removes its overlay DIV, and unwraps them.

$originalBodyContents.children().unwrap();

This is working great, as you can see in this demo:
http://jsfiddle.net/vKddB/1/

However, if there are content scripts on the page then they are all reloaded when the wrap occurs and they run their code again. This is causing a lot of unexpected behavior, as you can see in this demo:
http://jsfiddle.net/vKddB/3/

In the above demo you'll see that the "Show Alert" button shows an alert that says "hello!" when clicked. If you fire the plugin and close the plugin you'll notice that the "Show Alert" button now has two click handlers tied to it so it shows two alerts when clicked.

My plugin will not have control over the contents of the page it is running on. Is there a way I can prevent the inline scripts from re-running when I wrap the body contents in a DIV?

解决方案

$('script', $('body')).remove(); before your code

这篇关于包装内容元素会导致内联脚本触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！