jQuery Ajax-没有jQuery CSS


我正在尝试使用Ajax浏览页面。 我有一个页眉和页脚的div与这两者之间的id =“ content”。 我想要做的是替换内容,为此,我单击了启动以下JavaScript方法的按钮:</ p>

  $(“#content”)。load(“ home.html”,function(){
</ code> </ pre>

效果很好,但是问题是home.html中的内容没有jQuery CSS。 我试图将其链接到home.html文件中。 然后它实际上可以工作,但是它像这样复制页脚:</ p>

(由于声誉,我无法发布图片。)</ p>

我只是在网上找不到东西,可能是因为很难用几句话来描述这个问题。</ p>

我希望有人能帮助我。 :)</ p>

谢谢。</ p>
     </ div>



I am trying to navigate through pages with ajax. I have a header and footer a div with id="content" between those two. What I want to do is to replace the content, in order to this I have an onclick on a button that starts the following JavaScript method:

$("#content").load("home.html", function() {

Well it works, but the problem is that the stuff in home.html doesn't have the jQuery css. I tried to link it in the home.html file. It actually works then but it duplicates the footer like this:

http://i.stack.imgur.com/x8TZF.png (I cannot post pictures, because of reputation..)

I just cannot found something on the web, probably because it's hard to describe this issue in a few words.

I hope someone can help me out. :)



当使用jQuery将另一个HTML页面的内容加载到当前页面时,我发现 $。load()</ code>很难使用,有时也很不灵活。</ p>

另一种方法是使用 $。get()</ code>方法并解析返回的HTML,如下所示:</ p>

     var myHtml = $('#content',response); //获取所需的HTML部分
     $('#content')。html(myHtml); //将返回的内容加载到当前页面
</ code> </ pre>

如果您为选择器使用相同的ID(我通常使用一个类),那么这将不能很好地工作,但除此之外,它还使您可以更好地控制加载的内容。</ p>

希望这会有所帮助。</ p>

http://api.jquery.com/get/ </ p>
     </ div>



When loading content from another HTML page into the current page with jQuery, I've found $.load() to be difficult to work with and quite inflexible at times.

Another approach is to use the $.get() method and parse the returned HTML, like this:

$.get('home.html', function(response){    
    var myHtml = $('#content', response); //get the section of HTML we want
    $('#content').html(myHtml); //load the returned content into the current page    

This doesn't work all that well if you're using the same ID for the selectors (I normally use a class) but aside from that it gives you much more control over what gets loaded.

Hope this helps.


这是一个工作正常的代码。 我现在测试了。</ p>

  // index.html

             &lt;/ script&gt;</p> <p>         &lt;/ head&gt;<br>          &lt;身体&gt;<br>              <input type =“ button” id =“ click_me” Value =“点击我显示一些内容”> &lt;/ input&gt;<br>              <div id =“内容”></p> <p>             &lt;/ div&gt;<br>          &lt;/ body&gt;<br>          <script type =“ text / javascript”><br>                  $(&#39;#click_me&#39;)。click(function(){</p> <p>                     $(&#39;#content&#39;)。load(“ test.html”);<br>                  });<br>          &lt;/ script&gt;<br>      &lt;/ html&gt;</p> <p>//test.html<br> <div></p> <p>     <p>此处加载了内容&lt;/ p&gt;</p> <p>&lt;/ div&gt;<br> &lt;/ code&gt; &lt;/ pre&gt;</p> <p><p>希望这会有所帮助:)&lt;/ p&gt;<br>      &lt;/ div&gt;</p>



here is a code that works fine. I tested it right now.


            <script src="http://code.jquery.com/jquery-1.9.1.js"></script>

            <input type="button" id ="click_me" Value="click me to show some content" ></input>
            <div id = "content">

        <script type="text/javascript">



    <p>Loaded content here</p>


Hope this helps :)

Csdn user default icon