2017-07-27 71 views
0

我想加載一個文件到頭......但也保持目前的頭。追加外部文件到頭

目前...文件加載到頭部,但它在刪除標題之前這樣做。

如何將標題保留在頭部並同時加載文件。

$('head').load('../../external_file.html');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<head> 
 
    <title>Home</title> 
 
    <!-- External File goes here --> 
 
    <!-- I want the title to stay --> 
 
</head>

+0

我想你將不得不在JS中加載它並將結果追加到'head''$('head')。append(...)' –

+0

「external_file.html」是HTML片段還是HTML'文件'有''和''標籤? – guest271314

+0

它的一個片段。 –

回答

1

我不知道爲什麼你要插入的頭部HTML文件,但試試這個反正。

  1. 把你jquery.min.js頁腳或在你的HTML不是頭部上方的底部。
  2. 你可以通過ajax來做到這一點(我假設你試圖吐出你的外部html文件內的html元素)。

    (function(){ $.ajax({ url : "../../external_file.html", type: "GET", dataType: "html", success : function (data) { $(data).appendTo('head'); } }); })(); 這將發出ajax請求並返回您的html文件 的內容並追加到您的頭部。

enter image description here

enter image description here

:更新時間:

好嗎請點擊以下:

  1. 所有的腳本頭去的(標準)把它在你的html文件的下方。
  2. 帶走我的代碼.ajaxComplete(你不需要它反正ajaxComplete);
  3. 把你的$('。click_explore')。click()裏面的成功函數放在我的代碼裏面。因爲導致循環的當前結構。

    (function(){ 
        $.ajax({ 
         url : "../../external_file.html", 
         type: "GET", 
         dataType: "html", 
         success : function (data) { 
          $(data).appendTo('head'); 
          $(".click_explore").click(function() { 
           $('body').animate({ 
            scrollTop: $(".scroll_to_me").offset().top - 100 
           }, 500); 
           return false; 
          }); 
    
         } 
        }); 
    })(); 
    

我希望這幫助。

+0

這個作品...但它繼續前進和去... –

+0

它在一個永無止境的循環 –

+0

它不循環,它只能得到一次與'GET'請求。有沒有辦法可以做一個循環,你可以顯示你的代碼? P.S Zack桑德蘭更有可能使用。這很簡單。我的回答是一個長手的方法。 –

1

使用$.get()代替$.load()這將返回該文件的內容,您可以將內容從那裏添加元素的結束。

下面是一個粗略的例子:

$.get('../../external_file.html', function(response) { 
     $('head').append(response); 
}); 
0

我覺得load是一個快捷方式到完全取代HTML內容,所以如果你想保持標題,你需要使用幾行。

你可以跟蹤標題和負荷後添加回去:

var title = $('head title').text(); 
$('head').load('../../external_file.html'); 
$('head').prepend('<title>' + title + '</title>'); 

或者你也可以添加新的內容,以什麼樣的存在。

$.get('../../external_file.html', function(data) { 
    // add error handling 
    $('head').append(data); 
}); 
+0

我試圖實現這個...但它一直覆蓋它 –