加載HTML頁面與Java的容器從頁面容器

我是新來的編碼，這是我第一次來這樣下去容易:)加載HTML頁面與Java的容器從頁面容器

也請隨時告訴我這是一個笨方法中達到預期的效果。

我正在開發公司Intranet頁面，並已開始將頁面加載到index.php頁面中的容器中。這工作正常！

我遇到的問題是這個方法不適用於我在頁面內創建的按鈕，而這些按鈕正在被加載到容器中。

例子：

index.html 

     <ul class="nav navbar-nav"> 
      <li><a href="#" id="load_HR"> HR</a> 
      </li> 
      <li><a href="#" id="load_FAQ"> FAQ</a> 
      </li> 
      <li><a href="#" id="load_info"> Info</a> 
      </li> 
      <li><a href="#" id="load_directory"> Directory</a> 
      </li> 
     </ul> 

$(document).ready(function() { 
    $("#load_HR").on("click", function() { 
    $("#content").load("HR.html"); 
}); 
    $("#load_FAQ").on("click", function() { 
    $("#content").load("FAQ.php"); 
}); 
    $("#load_Info").on("click", function() { 
    $("#content").load("info.html"); 
}); 
    $("#load_directory").on("click", function() { 
    $("#content").load("directory.php"); 
}); 
}); 

<div id="content"></div>

這是怎麼我的導航欄按鈕加載頁面放入容器中，能正常工作。

現在我想將HR.html頁面內的頁面加載到當前由HR.html頁面佔用的容器中。

看起來很簡單，聽起來很複雜，而且我會繞着圈子走。

請幫忙！ :)

來源

2017-04-19 Liam Mead

看起來像JQuery的.load（）函數試圖做一個XMLHttpRequest 這將導致以下錯誤

cannot load Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

嘗試使用純JS它爲我工作。

$(document).ready(function() { $("#load_HR").on("click", function() { document.getElementById("content").innerHTML='<object type="text/html" data="HR.html" ></object>'; });

所以，你的代碼應該是這個樣子

 <ul class="nav navbar-nav"> 
      <li><a href="#" id="load_HR"> HR</a> 
      </li> 
      <li><a href="#" id="load_FAQ"> FAQ</a> 
      </li> 
      <li><a href="#" id="load_info"> Info</a> 
      </li> 
      <li><a href="#" id="load_directory"> Directory</a> 
      </li> 
     </ul> 

$(document).ready(function() { 
    $("#load_HR").on("click", function() { 
    document.getElementById("content").innerHTML='<object type="text/html" data="HR.html" ></object>'; 
}); 
    $("#load_FAQ").on("click", function() { 
    document.getElementById("content").innerHTML='<object type="text/html" data="FAQ.php" ></object>'; 
}); 
    $("#load_Info").on("click", function() { 
    document.getElementById("content").innerHTML='<object type="text/html" data="info.html" ></object>'; 
}); 
    $("#load_directory").on("click", function() { 
    document.getElementById("content").innerHTML='<object type="text/html" data="directory.php" ></object>'; 
}); 
}); 

<div id="content"></div>

來源

2017-04-19 15:34:46 DevKimo

感謝您的幫助DevKimo！我終於搞清楚了，我可以通過向加載到容器中的頁面添加一個函數來解決我的問題。 –

，我發現我的jQuery答：

加入此功能是加載到內容容器例如頁面當我加載HR.html頁面時：

function loadbenefits() { 
    $('#hrContent').load('CompanyBenefits.html'); 
}

然後做一個按鈕，加載新的頁面與的onClick（容器=「loadbenefits（）」，例如：

<button onClick="loadbenefits()" class="btn" type="button" value="Go"> Some Text </button>

來源

2017-04-21 08:39:24

加載HTML頁面與Java的容器從頁面容器

回答

相關問題