每次html页面的内部div发生变化时如何加载数据？
在我的网站中，我制作了一个主页，其中有 3 个 div：页眉、页脚和主页。标题 div 有一些更改主 div 的按钮。意味着页面仅加载一次，然后我只需在单击某个按钮时更改主 div 即可。我只是在单击某个按钮时在主 div 中放置一个 html 页面。
我已在每个页面的 $(document).ready 函数中添加警报。每当主 div 发生更改时，都会发出这些警报，因为主 div 是一个 html 页面。但这些警报并没有到来。为什么会这样呢。我想每次更改主 div 时加载一些数据。我怎样才能做到这一点？提前致谢。
主页：
<html>
<head>
<script type="text/javascript" src="jquery-1.7.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$("#btn1").click(function(){
$("#main").load("page1.html");
});
$("#btn2").click(function(){
$("#main").load("page2.html");
});
});
</script>
</head>
<body>
<div id="header"> --- </div>
<div id="maincontent"><div id="main"> --- </div></div>
<div id="footer"> --- </div>
</body>
</html>
第1页：
<html>
<head>
<script type="text/javascript" src="jquery-1.7.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
// trying to load data. but its not working
});
</script>
</head>
<body>
<div id="page1-div"> --- </div>
</body>
</html>
In my website i made a mainpage which has 3 divs: header, footer and main. Header div has some buttons which change main div. Means that page is loaded only once then i just change main div when some button is clicked. I simply put a html page in main div when some button is clicked.
i have put alert in every page's $(document).ready function. Whenever main div is changed, these alerts should come because main div is a html page. But these alerts are not coming. Why is that so. I want to load some data every time when main div is changed. How can i do that? Thanks in advance.
main page:
<html>
<head>
<script type="text/javascript" src="jquery-1.7.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$("#btn1").click(function(){
$("#main").load("page1.html");
});
$("#btn2").click(function(){
$("#main").load("page2.html");
});
});
</script>
</head>
<body>
<div id="header"> --- </div>
<div id="maincontent"><div id="main"> --- </div></div>
<div id="footer"> --- </div>
</body>
</html>
page1:
<html>
<head>
<script type="text/javascript" src="jquery-1.7.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
// trying to load data. but its not working
});
</script>
</head>
<body>
<div id="page1-div"> --- </div>
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您只是在 DOM 中进行更改，而不是加载会触发 $(document).ready(); 的新文档。
基于问题标签，我假设您正在使用 AJAX 加载内容。在这种情况下，只需使用 jQuery 的 $.ajax* 函数回调即可在加载内容时执行任何类型的操作。
You are just making changes in DOM, not loading new document which would trigger $(document).ready();.
Based in questions tags, i assume that you are loading content using AJAX. In that case just use jQuery's callbacks for $.ajax* functions to do any kind of action when content is loaded.
这看起来像你所需要的。
http://james.padolsey.com/javascript/monitoring-dom-properties/
This looks like what you need.
http://james.padolsey.com/javascript/monitoring-dom-properties/