Question

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?

Answer 1

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