HTML in HTML content

Question

How can I embed large HTML tags into this scenario?

$(document).ready(function () {
            window.showim = function(src) {
                $("#divcont1").html(src);
            };
        });

Instead of <h1>test</h1> I need to insert large html content

<span class="spcusr" onclick="showim('<h1>test</h1>');">click me</span>

      <div id="divcont1"></div>

My Large HTML Content Sample

<div style="width:976px; height:576px; overflow:hidden; background-repeat:no-repeat; background-image:url(MASTER.jpg)">
<table style="cursor:pointer;">
  <tr height="144">
    <td width="485"  onclick="window.location='#';">&nbsp;</td>
    <td width="485" onclick="window.location='#';">&nbsp;</td>
  </tr>
  <tr height="144">
    <td onclick="window.location='#';">&nbsp;</td>
    <td onclick="window.location='#';">&nbsp;</td>
  </tr>
  <tr height="144">
    <td onclick="window.location='#';">&nbsp;</td>
    <td onclick="window.location='#';">&nbsp;</td>
  </tr>
  <tr height="144">
    <td onclick="window.location='#';">&nbsp;</td>
    <td onclick="window.location='#';">&nbsp;</td>
  </tr>
</table>
</div>

My main problem is at double quotes and quotes. Beacuase onclick="showim('this started with single quotes and no more quotes allowed inside')"; So, what to do in this situation? Thanks

Take a look at html string encoding and decoding methods of javascript. — Rajesh Dhiman
– Rajesh Dhiman, Commented Jan 29, 2014 at 13:21
An attribute is not a good place for storing HTML content. That's anti-pattern. You should consider using a templating library. — Ram
– Ram, Commented Jan 29, 2014 at 13:22

Community · Accepted Answer · 2017-05-23 10:31:41Z

1

You have to Escape Quotes that go deeper than " and '.

This here, may help you: Escape quotes in JavaScript

edited May 23, 2017 at 10:31

CommunityBot

11 silver badge

answered Jan 29, 2014 at 13:17

Panade

2893 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

aksu · Accepted Answer · 2014-01-29 13:19:50Z

1

Escape the quotes before doing anything in the function.

window.showim = function(src) {
    src = src.replace(/'/g, "\'");
    src = src.replace(/"/g, '\"')
    $("#divcont1").html(src);
};

answered Jan 29, 2014 at 13:19

aksu

5,2365 gold badges26 silver badges39 bronze badges

Collectives™ on Stack Overflow

HTML in HTML content

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related