HTML in javascript function

Question

I have a javascript popUp function...

popUp(title, body){
    $('body').append('<div id="popupWindow"><div class="close"></div>
        <h2 class="title">'+title+'</h2>
        <div class="body">'+body+'</div>
        </div>");
    // then on $('.close').click(func(){ remove() etc... } );
    // and keyCode == 13 remove();
}

that inserts the two arguments into popup window that is then inserted into the html of the document. I had the idea of having a <form> as body but it craps out??

I have tried various things and it would appear to be the html as the argument which is causing the problem. I have limited javascript/jQuery experience, so any help you guys/gals can give would be much appreciated.

Thanks, Si

It's not a complete copy - However your right, there was a stray quote i hadnt escaped in the form thanks guys (hour well spent for a typo...)

Possibly a typo, but the end of your html string is using the wrong type of quote. — user400654
– user400654, Commented Aug 8, 2012 at 14:05

Edward Ruchevits · Accepted Answer · 2012-08-08 14:08:23Z

1

Set an identifier for your form and use it in JavaScript code.

<form id="myform"></form>


popUp(title, body){
    $('#myform').append('<div id="popupWindow"><div class="close"></div>
        <h2 class="title">'+title+'</h2>
        <div class="body">'+body+'</div>
        </div>');
    // then on $('.close').click(func(){ remove() etc... } );
    // and keyCode == 13 remove();
}

By the way, there was an error with quotes in your append statement.

edited Aug 8, 2012 at 14:08

answered Aug 8, 2012 at 14:06

Edward Ruchevits

6,69612 gold badges54 silver badges87 bronze badges

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

Comments

Derek Hunziker · Accepted Answer · 2012-08-08 14:13:17Z

1

Is popUp a function? You also have some line-break issues. Personally, I would use jQuery to construct your elements... it's much more elegant.

function popUp(title, body){

    var $popup = $('<div />').attr('id', 'popupWindow');
    var $close = $('<div />').addClass('close');
    var $title = $('<h2 />').addClass('title').text(title);
    var $body = $('<div />').addClass('body').html(body);

    $popup.append($close).append($title).append($body);
    $('body').append($popup);
    // To append to a form, you can target it here instead of 'body'

}

popUp('My Title', 'Some <strong>body</strong> content');

answered Aug 8, 2012 at 14:13

Derek Hunziker

13.2k4 gold badges61 silver badges108 bronze badges

Comments

user1306004 · Accepted Answer · 2012-08-08 14:19:29Z

0

I think the problem using single and double quotes in append method, use ASCII, codes like :

 + String.fromCharCode(34) + title + String.fromCharCode(34) +

String.fromCharCode(34) is used for " and String.fromCharCode(39) is used for '.

answered Aug 8, 2012 at 14:19

user1306004

Collectives™ on Stack Overflow

HTML in javascript function

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related