c# - jqueryでdivコンテンツを設定できます

Question

fooというdivに動的テキストを配置できないのはなぜですか？以下は、asp.netコードビハインドの方法です。

StringBuilder script = new StringBuilder();
        script.Append("<script type='text/javascript'>");
        script.Append("                                $(document).ready(function () {");
        script.Append("                                    $('<div id=foo></div>').appendTo('body');");
        script.Append("                                    var dlg = $('#foo');");
        script.Append("                                    dlg.dialog({");
        script.Append("                                         autoOpen: true,");
        script.Append("                                         resizable: false,");
        script.Append("                                         draggable: false,");
        script.Append("                                         modal: true,");
        script.Append("                                         title: 'Información',");
        script.Append("                                         width: 400,");
        script.Append("                                         height: 200,");
        script.Append("                                         buttons: {");
        script.Append("                                            'Cerrar': function () {");
        script.Append("                                            $(this).dialog('close');");
        script.Append("                                         }");
        script.Append("                                       }");
        script.Append("                                   });");
        script.Append("     $('#foo').html(<p>"+info+"</p>);");
        script.Append("                                });");

        script.Append("</script>");

        ClientScript.RegisterStartupScript(this.GetType(), "launchModalWindow", script.ToString());

問題は次の行にあります。

script.Append("     $('#foo').html(<p>"+info+"</p>);");

Answer 1

script.Append("$('#foo').html('<p>hola</p>');");

document.readyのコンテキスト外です。

ページをロードする準備ができたときに実行されるように、1行上に移動します。

StringBuilder script = new StringBuilder();
    script.Append("<script language='javascript'>");
    script.Append("                                $(document).ready(function () {");
    script.Append("                                    $('<div id=foo></div>').appendTo('body');");
    script.Append("                                    var dlg = $('#foo');");
    script.Append("                                    dlg.dialog({");
    script.Append("                                         autoOpen: true,");
    script.Append("                                         resizable: false,");
    script.Append("                                         draggable: false,");
    script.Append("                                         modal: true,");
    script.Append("                                         title: 'Información',");
    script.Append("                                         width: 400,");
    script.Append("                                         height: 200,");
    script.Append("                                         buttons: {");
    script.Append("                                            'Cerrar': function () {");
    script.Append("                                            $(this).dialog('close');");
    script.Append("                                         }");
    script.Append("                                       }");
    script.Append("                                   });");
    script.Append("$('#foo').html('<p>hola</p>');");
    script.Append("                                });");
    script.Append("</script>");

Answer 2

である必要があります<div id="foo">。引用符がありません。

また、＃fooへの更新を

$(document).ready(function() {
    $('#foo').html('<p>hola</p>');
}

Answer 3

次のような動的テキストを配置します。

script.Append("                                    $('<div id=foo class=vw1>"+ info +"</div>').appendTo('body');");