我知道通过 js 或 jQuery 在容器框架中加载页面或文件的基础知识，但是通过像 onClick 这样的事件监听器
JS-
document.getElementById("id").innerHTML = "<object type = 'text/html' data = 'myfile.html'> </data>"
JQUERY -
$("#id").load("myfile.txt");
但是我想要实现的功能与此相同，但不仅仅是在容器框架中加载onClick，而是在url上添加一个参数，例如:
if I click on a button, `webpage.html` will load on `<div>` container frame, and the `url` will change to `http://example.com/?loaded=webpage.html`
我想这样做，所以我可以更改url字符串或按元素并加载div上的某个文件容器框架。
与 facebook 管理 profile.php 的原理相同
http://facebook.com/profile.php?=mypersonalprofile- load my profilehttp://facebook.com/profile.php?=myfriendsprofile- load my friends profile
我希望我能够清楚地表达它。
最佳答案
我认为这可以证明您在寻找什么
<html>
<head>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<button class="loadButton" value="input1.txt">Load file 1</button>
<button class="loadButton" value="input2.txt">Load file 2</button>
<div id="view"></div>
</body>
<script>
$(function(){
// Call loadPage on init
loadPage();
$(".loadButton").on("click", function(){
// Change URL, you can change "/testJS/index.html" to suit your web address
history.pushState({}, "", "/testJS/index.html?loaded=" + $(this).attr("value"));
$("#view").empty();
$("#view").load($(this).attr("value"));
});
});
function loadPage() {
console.log("start");
var href = window.location.href;
var index = href.indexOf("?loaded=");
// Load data if we define the loaded param
if (index > -1) {
data = href.substring(index + 8);
console.log(index + " " + data);
$("#view").empty();
$("#view").load(data);
}
}
</script>
</html>
关于javascript - 在 <div> 内或在 url 上添加 "?param="时加载页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32878967/