0

次のhtmlマークアップがあります。このマークアップをjqueryを介してマスターページ(または他のHTMLページ)に追加したいと思います。マスターページに触れたくないので、このhtmlページの本文にこのhtmlを含めたくありません。マスターページにdivを追加し、そのdivに次のマークアップを追加したいだけです。jqueryを介してこのhtmlを追加したいと思います。どうやってするの?

    <div id="mymenuDiv">
    <ul id="nav">
        <li class="top"><a href="#nogo1" class="top_link"><span>Home</span></a></li>
        <li class="top"><a href="#nogo2" id="products" class="top_link"><span class="down">Products</span></a>
            <ul class="sub">
                <li><a href="#nogo3" class="fly">Cameras</a>
                        <ul>
                            <li><a href="#nogo4">Nikon</a></li>
                            <li><a href="#nogo5">Minolta</a></li>
                            <li><a href="#nogo6">Pentax</a></li>
                        </ul>
                </li>
                <li class="mid"><a href="#nogo7" class="fly">Lenses</a>
                        <ul>
                            <li><a href="#nogo8">Wide Angle</a></li>
                            <li><a href="#nogo9">Standard</a></li>
                            <li><a href="#nogo10">Telephoto</a></li>
                            <li><a href="#nogo11" class="fly">Zoom</a>
                            </li>
                            <li><a href="#nogo15">Mirror</a></li>
                        </ul>
                </li>
                <li><a href="#nogo19">Flash Guns</a></li>
                <li><a href="#nogo20">Tripods</a></li>
                <li><a href="#nogo21">Filters</a></li>
            </ul>
        </li>
    </ul>
    </div>
4

4 に答える 4

2
$('body').append("<div id=\"mymenuDiv\">\r\n    <ul id=\"nav\">\r\n        <li class=\"top\"><a href=\"#nogo1\" class=\"top_link\"><span>Home<\/span><\/a><\/li>\r\n        <li class=\"top\"><a href=\"#nogo2\" id=\"products\" class=\"top_link\"><span class=\"down\">Products<\/span><\/a>\r\n            <ul class=\"sub\">\r\n                <li><a href=\"#nogo3\" class=\"fly\">Cameras<\/a>\r\n                        <ul>\r\n                            <li><a href=\"#nogo4\">Nikon<\/a><\/li>\r\n                            <li><a href=\"#nogo5\">Minolta<\/a><\/li>\r\n                            <li><a href=\"#nogo6\">Pentax<\/a><\/li>\r\n                        <\/ul>\r\n                <\/li>\r\n                <li class=\"mid\"><a href=\"#nogo7\" class=\"fly\">Lenses<\/a>\r\n                        <ul>\r\n                            <li><a href=\"#nogo8\">Wide Angle<\/a><\/li>\r\n                            <li><a href=\"#nogo9\">Standard<\/a><\/li>\r\n                            <li><a href=\"#nogo10\">Telephoto<\/a><\/li>\r\n                            <li><a href=\"#nogo11\" class=\"fly\">Zoom<\/a>\r\n                            <\/li>\r\n                            <li><a href=\"#nogo15\">Mirror<\/a><\/li>\r\n                        <\/ul>\r\n                <\/li>\r\n                <li><a href=\"#nogo19\">Flash Guns<\/a><\/li>\r\n                <li><a href=\"#nogo20\">Tripods<\/a><\/li>\r\n                <li><a href=\"#nogo21\">Filters<\/a><\/li>\r\n            <\/ul>\r\n        <\/li>\r\n    <\/ul>\r\n    <\/div>")

さらに良いことに、それをHTMLファイルに貼り付けて、次のようにします。

$('body').load('myhtml.html');
于 2012-11-21T05:44:16.167 に答える
0

$.ajax()これには、次のようにjQueryを使用できます。

$.ajax({
    url: 'ajax/test.html',
    success: function(data) {
      $('#mydiv').html(data);
    }
});

これをさらに簡単にするために、$(selector).load()次のようになります。

$('#mydiv').load('ajax/test.html')

ajaxページからタグidのを指定することで、さらに一歩進めることができます。これは、 ajaxページが完全なhtmlページであり、呼び出し元のページの本文に、、などのタグdivを挿入したくない場合に役立ちます。あなたはこのようにそれを行うことができます:htmlhead

$('#mydiv').load('ajax/test.html #div_tag_to_load')
于 2012-11-21T07:08:01.127 に答える
0

最も簡単な方法:

$('#myMenuDiv').html('<ul id="nav"><li class="top"><a href="#nogo1" class="top_link"><span>Home</span></a></li><li class="top"><a href="#nogo2" id="products" class="top_link"><span class="down">Products</span></a><ul class="sub"><li><a href="#nogo3" class="fly">Cameras</a><ul><li><a href="#nogo4">Nikon</a></li><li><a href="#nogo5">Minolta</a></li><li><a href="#nogo6">Pentax</a></li></ul></li><li class="mid"><a href="#nogo7" class="fly">Lenses</a><ul><li><a href="#nogo8">Wide Angle</a></li><li><a href="#nogo9">Standard</a></li><li><a href="#nogo10">Telephoto</a></li><li><a href="#nogo11" class="fly">Zoom</a></li><li><a href="#nogo15">Mirror</a></li></ul></li><li><a href="#nogo19">Flash Guns</a></li><li><a href="#nogo20">Tripods</a></li><li><a href="#nogo21">Filters</a></li></ul></li></ul>');

それは醜いです。

于 2012-11-21T05:44:33.577 に答える
0

このようなことを試してください

 $(function() {
   $(#master page div id).append($(#id of div from which you have to append));
 });
于 2012-11-21T05:46:18.550 に答える