Bug Tracker

Modify

Ticket #5328 (closed bug: invalid)

Opened 5 years ago

Last modified 2 years ago

replaceWith - "node cannot be inserted ..."

Reported by: Ghodmode Owned by: Ghodmode
Priority: major Milestone: 1.4
Component: core Version: 1.3.2
Keywords: Cc: ghodmode@…
Blocking: Blocked by:

Description

I'm trying to do image replacement on a click event using the replaceWith function and a list of images. When I click the image disappears entirely and I get the error (in Firebug console window): 'Node cannot be inserted at the specified point in the hierarchy" code: "3  http://home/dev/planeticeland/js/jquery-1.3.2.min.js Line 12'

Here's some code: HTML: <div id="sidebar-form">

<div class="img-wrapper">

<img alt="iceland" src="images/Iceland_map_main.png" usemap="#map"/>

</div>

<map name="map"> <area shape="circle" coords="50,93,7"

alt="Reykjavík Area" title="Reykjavík Area" nohref="nohref" />

JavaScript: var maps = []; mapsmain? = new Image(); ... mapsReykjavík_Area? = new Image(); ...

for ( i in maps ) {

var map_name; map_name = 'images/Iceland_map_'+i+'.png'; maps[i].src = map_name; maps[i].useMap = '#map';

}

$(document).ready(function(){

var areas = $('area'); for ( var i=0; i<areas.length; i++ ) {

$(areas[i]).bind('mouseenter mouseleave click', mapHilight);

};

});

function mapHilight(event){

$('#sidebar-form .img-wrapper img:first').replaceWith( maps[place.replace(/ /, '_')] );

}

It works fine on the mouseenter and mouseleave events. The error message only occurs on the click event.

The following code works, but doesn't use jQuery functions:

var sidebar_form = document.getElementById('sidebar-form'); var img_wrapper; var sidebar_divs = sidebar_form.getElementsByTagName('DIV'); for ( var i=0; i<sidebar_divs.length; i++ ) {

if (sidebar_divs[i].className == 'img-wrapper') {

img_wrapper = sidebar_divs[i]; break;

}

} var mapImage = img_wrapper.getElementsByTagName('IMG')[0]; img_wrapper.removeChild(mapImage); img_wrapper.appendChild( maps[place.replace(/ /, '_')] );

It identifies the containing element and the image, removes the image, than appends the replacement image. Isn't that pretty much what the replaceWith function is supposed to do?

Change History

comment:1 Changed 3 years ago by rwaldron

  • Owner set to Ghodmode
  • Status changed from new to pending

Thanks for taking the time to contribute to the jQuery project! Please provide a reduced jsFiddle test case to help us assess your ticket!

Additionally, test against the jQuery 0 GIT version to ensure the issue still exists. Be Excellent to eachother!

comment:2 Changed 3 years ago by trac-o-bot

  • Status changed from pending to closed
  • Resolution set to invalid

Automatically closed due to 14 days of inactivity.

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.