Jquery Dom Manipulation: Replace Elements

I have sầu this thing I m trying lớn vị. I have sầu a main picture of a map và within that bản đồ there are regions. These regions have sầu hot spots on them so you can clichồng them và it will replace the whole maps with only the region. (just a simple div swap).

I need it as a div because in this div i have the hot spots listed.

There are a total of 4 divs that I am going khổng lồ need lớn do this with.

If anyone could help me that would be awesome!

So liên kết that are listed in a table need to lớn replace the image in a separate div.

All Regions (shows main map) (link)Northern Region (link)Southern Region (link)Eastern Region (link)
All Regions image
northern image
southern image
Eastern image
I am not allowed khổng lồ post images because I don"t have enough points so I know the image link wont work.

Bạn đang xem: Jquery dom manipulation: replace elements


jquery html swap
Share
Improve this question
Follow
edited Feb 21 "11 at 6:52
*

Santosh Linkha
13.6k1717 gold badges7272 silver badges113113 bronze badges
asked Feb 21 "11 at 6:15
*

JakeJake
40111 gold badge66 silver badges1212 bronze badges
7
| Show 2 more comments

3 Answers 3


Active sầu Oldest Votes
62
You can use .replaceWith()


$(function() $(".region").click(function(e) e.preventDefault(); var content = $(this).html(); $("#map").replaceWith("
" + content + "
"); ););
region1
region2
region3
Share
Improve sầu this answer
Follow
edited Aquảng cáo 6 "17 at 12:53

*

KyleMit
50.4k5151 gold badges362362 silver badges529529 bronze badges
answered Feb 21 "11 at 6:20
*

GowriGowri
15.4k2525 gold badges9494 silver badges153153 bronze badges
3
Add a comment |
16
HTML


i need lớn be replaced
i am replacement
JavaScript

jQuery("#replaceMe").replaceWith(jQuery("#iamReplacement"));
Share
Improve sầu this answer
Follow
edited Aquảng cáo 6 "17 at 12:54

*

KyleMit
50.4k5151 gold badges362362 silver badges529529 bronze badges
answered Feb 21 "11 at 6:52
Praveen PrasadPraveen Prasad
29.3k1616 gold badges6767 silver badges104104 bronze badges
Add a bình luận |
1
This should help you

HTML

All Regions (shows main map) (link)
Northern Region (link)
Southern Region (link)
Eastern Region (link)

All Regions image
northern image
southern image
Eastern image
JavaScript

var originalmap;var flag = false;$(function () $(".replace").click(function() flag = true; originalmaps = $("#mainmap"); $("#mainmap").replaceWith($(this)); ); $(".showall").click( function() if(flag == true) $("#region").append($("#mainmapplace .replace")); $("#mainmapplace").children().remove(); $("#mainmapplace").append($(originalmap)); //$("#mapplace").append(); ))CSS

#mainmapplace width: 100px; height: 100px; background: red;#region div width: 100px; height: 100px; background: blue; margin: 10px 0 0 0;
Share
Improve sầu this answer
Follow
answered Feb 23 "11 at 4:40
Santosh LinkhaSantosh Linkha
13.6k1717 gold badges7272 silver badges113113 bronze badges
Add a bình luận |

Your Answer


Thanks for contributing an answer to Stachồng Overflow!

Please be sure lớn answer the question. Provide details and chia sẻ your research!

But avoid

Asking for help, clarification, or responding lớn other answers.Making statements based on opinion; baông xã them up with references or personal experience.

Xem thêm: Tải Game Giàu To Club For Android, Giauto Club Ios/Android

To learn more, see our tips on writing great answers.


Draft saved
Draft discarded

Sign up or log in


Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Submit

Post as a guest


Name
E-Mail Required, but never shown


Post as a guest


Name
Thư điện tử

Required, but never shown


Post Your Answer Discard

By clicking “Post Your Answer”, you agree khổng lồ our terms of service, privacy policy và cookie policy


Not the answer you're looking for? Browse other questions tagged jquery html swap or ask your own question.


The Overflow Blog
Featured on Meta
Linked
2
Removing the div child in jquery
2
How to replace one div with another when clicking the html hyperlink
0
Replace div with new div using jQuery or javascript
2
.replaceWith() not working when replacing a div with another after button click
0
How to replace several divs in html with several other hidden divs using javascript using a button toggle feature
Related
2163
Make a div fill the height of the remaining screen space
2943
How can I change an element's class with JavaScript?
4280
Setting “checked” for a checkbox with jQuery
2219
How can I make a div not larger than its contents?
7715
How bởi vì I redirect to lớn another webpage?
1773
How lớn move an element into lớn another element?
2294
How khổng lồ make a div 100% height of the browser window
4100
Change a HTML5 input's placeholder color with CSS
1072
How to overlay one div over another div
Hot Network Questions more hot questions

Question feed
Subscribe lớn RSS
Question feed To subscribe to lớn this RSS feed, copy and paste this URL inlớn your RSS reader.


default
Stack Overflow
Products
Company
Stachồng Exchange Network
site design / biểu tượng logo © 2021 Stachồng Exchange Inc; user contributions licensed under cc by-sa. rev2021.3.17.38813