web-dev-qa-db-ja.com

.htmlタグ内にjQuery変数値を追加する方法

チェックボックスを動的に作成するHTMLタグを含むjquery変数があります。ダイアログボックス内のチェックボックスを表示するには、jqueryの.htmlタグ内にこの変数を追加する必要があります..また、フォーム内にチェックボックスコードを含めるためのフォームタグが含まれています.

これは、htmlタグを含むvariabelです。

var chbx=<input type="checkbox"   id="Mumbai" name="Mumbai" value="Mumbai" />Mumbai<br />
<input type="checkbox"   id=" Delhi" name=" Delhi" value=" Delhi" /> Delhi<br />\
<input type="checkbox"   id=" Bangalore" name=" Bangalore" value=" Bangalore" /> Bangalore<br />

そして、ここにフォームを含む.htmlタグがあります..

var $dialog = $('<div></div>').html("<form id='myform'>" +chbx+ "</form>")
        .dialog({
            autoOpen: false,
            title: 'Select Sites',
            buttons: {
                "Submit": function() {  $('form#myform').submit();},
                "Cancel": function() {$(this).dialog("close");}
            }
        });

私は+ chbx +のような変数を追加しようとしましたが、それは発生せず、空のダイアログボックスを表示しました。

9
Adi

HTML:

<div id="myDiv">
    <form id="myForm">
    </form> 
</div>

jQuery:

var chbx='<input type="checkbox" id="Mumbai" name="Mumbai" value="Mumbai" />Mumbai<br /> <input type="checkbox" id=" Delhi" name=" Delhi" value=" Delhi" /> Delhi<br/><input type="checkbox" id=" Bangalore" name=" Bangalore" value=" Bangalore"/>Bangalore<br />';

$("#myDiv form#myForm").html(chbx);

//to insert dynamically created form 
$("#myDiv").html("<form id='dynamicForm'>" +chbx + "'</form>");

デモ

14
Ashad Shanto

こちらをご覧ください リンク

HTML

<div id="products"></div>

JS

var someone = {
"name":"Mahmoude Elghandour",
"price":"174 SR",
"desc":"WE Will BE WITH YOU"
 };
 var name = $("<div/>",{"text":someone.name,"class":"name"
});

var price = $("<div/>",{"text":someone.price,"class":"price"});
var desc = $("<div />", {   
"text": someone.desc,
"class": "desc"
});
$("#products").fadeIn(1500);
$("#products").append(name).append(price).append(desc);
3