谁能用最简单的代码告诉我，如何通过简单的单击将 html 页面加载和卸载到名为“myDiv”的 div 中？
当我按下导航菜单上的另一个按钮时，我将卸载“myDiv”并替换为另一个页面。
这是什么设置？
编辑
我有 3 页（page1.html、page2.html、page3.html）
我的导航如下：
<ul>
<li><a href="page1.html"></a></li>
<li><a href="page2.html"></a></li>
<li><a href="page3.html"></a></li>
</ul>
我正在尝试将这些页面加载到“myDiv”中，每次我单击不同的页面按钮时，每个页面都会替换之前加载的页面。就这样。
我希望我把我想做的事情清楚地表达出来，希望不会遗漏任何重要的事情。
【问题讨论】：
标签： html
假设你可以使用 javascript/jQuery（你没有提供很多关于你的环境的信息）......
看看 jQuery load() 方法。
<div id="myDiv"></div>
<button id="myButton">Click Me</button>
<script type="text/javascript">
$( document ).ready( function() {
$( '#myButton' ).click( function() {
$( '#myDiv' ).load( 'test.html' );
});
});
</script>
这应该可以完成您的工作。剩下的交给你:)
编辑：
好的，更符合您正在寻找的内容...
假设您可以修改标记并向您的 a 元素添加类属性...
<ul>
<li><a href="page1.html" class="dynamicLoad"></a></li>
<li><a href="page2.html" class="dynamicLoad"></a></li>
<li><a href="page3.html" class="dynamicLoad"></a></li>
</ul>
<script type="text/javascript">
$( document ).ready( function() {
$( 'a.dynamicLoad' ).click( function( e ) {
e.preventDefault(); // prevent the browser from following the link
e.stopPropagation(); // prevent the browser from following the link
$( '#myDiv' ).load( $( this ).attr( 'href' ) );
});
});
</script>
因此，任何具有 dynamicLoad 类的“a”元素都会在单击时触发此事件。我们不希望浏览器尝试跟随链接，所以我们使用 preventDefault() 和 stopPropagation()。唯一的其他区别是我们不是静态加载“test.html”。我们通过使用 jQuery 的 $( this ) 来确定要加载的 html 页面，它表示触发该函数的元素。使用 attr() 方法，该方法返回元素的特定属性的值。在这种情况下，是 href 属性。
问题？
【讨论】：