CODEWITHSUNDEEP
javascriptjqueryhtml
Simon Hughes
Simon Hughes

Reputation: 115

HTML in javascript function

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...)

Upvotes: 0

Views: 125

Answers (3)

user1306004
user1306004

Reputation:

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 '.

Upvotes: 0

Derek Hunziker
Derek Hunziker

Reputation: 13141

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');

Upvotes: 1

Edward Ruchevits
Edward Ruchevits

Reputation: 6696

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.

Upvotes: 1

Related Questions