Bug Tracker

Modify

Ticket #10349 (closed bug: invalid)

Opened 20 months ago

Last modified 20 months ago

domManip Causes Duplicate Events to Fire if Event Binding Code is Contained Within Manipulated Element

Reported by: js22@… Owned by:
Priority: low Milestone: None
Component: manipulation Version: 1.6.4
Keywords: Cc:
Blocking: Blocked by:

Description

Example here:  http://jsfiddle.net/9amah/

Following the #button div, there is some event binding code to immediately set up a click handler on #button.

When the element is domManip'd, the click event remains intact.

However this line:

if ( scripts.length ) {
    jQuery.each( scripts, evalScript );
}

Causes the event handler to be rebound.

Change History

comment:1 follow-up: ↓ 2 Changed 20 months ago by rwaldron

  • Priority changed from undecided to low
  • Resolution set to invalid
  • Status changed from new to closed
  • Component changed from unfiled to manipulation

jQuery cannot be held accountable for what happens inside your script tags

comment:2 in reply to: ↑ 1 Changed 20 months ago by anonymous

Replying to rwaldron:

jQuery cannot be held accountable for what happens inside your script tags

A motivating example would be you've developed some kind of re-usable widget for a framework such as Django. When you actually use the widget, you want it somewhat self-contained. Additionally, the framework might dictate that this is in fact, the "proper" place to put these scripts - and I agree: any additional javascript that makes the widget work is nice to have as part of the widget's output. It works when rendered on the initial page load, it works when rendered on the server side and ajax'd into existence.

It's also nice to put this kind of javascript immediately after the element markup in order to avoid FUBC issues.

If there's a non-trivial, performant way to detect cases where you're doing things such as event binding, it *might* be nice to make this behaviour transparent rather than requiring special effort on the part of the developer - such as putting the event binding code into the a <head><script> section conditionally.

Thinking out loud.

  1. Detect identical script contents and don't duplicate them.
  2. Parameterize the behaviour.
  3. Track the source script that caused an event handler to be bound in the first place. Don't re-execute this script the second time around. Problematic because the script might have other pieces that you want re-run when domManip is called. I can't think of when this might be.

Any of these is rife with backward compatibility concerns.

Workaround: Clean up these event binding scripts yourself. The last action inside the script might be to remove the script tag from the dom.

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

View

Add a comment

Modify Ticket

Action
as closed
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.