0

我有一个带有 div 的页面,其中有一个 id 居中的菜单。当页面第一次加载时,它在 div 中有一个包含 10 个选项的菜单。这些选项中的每一个都有一个不同的命名 ID,例如 menu2、menu3 等,并带有一个空白的 href 链接。在初始加载时,我可以更改为任何菜单,一旦完成,我将无法选择任何其他菜单并使用新菜单再次更改 div 的内容

我的脚本是

<script type="text/javascript">
    $(document).ready(function(){
       $("#menu2").click(function(){
        $('#centeredmenu').load('menu2.php');
       }); 
       $("#menu3").click(function(){
        $('#centeredmenu').load('menu3.php');
       });
       $("#menu4").click(function(){
        $('#centeredmenu').load('menu4.php');
       });
       $("#menu5").click(function(){
        $('#centeredmenu').load('menu5.php');
       });
       $("#menu6").click(function(){
        $('#centeredmenu').load('menu6.php');
       });
       $("#menu7").click(function(){
        $('#centeredmenu').load('menu7.php');
       });
       $("#menu8").click(function(){
        $('#centeredmenu').load('menu8.php');
       });
       $("#menu9").click(function(){
        $('#centeredmenu').load('menu9.php');
       });
       $("#menu10").click(function(){
        $('#centeredmenu').load('menu10.php');
       });
       $("#menu11").click(function(){
        $('#centeredmenu').load('menu11.php');
       });
     });
</script>

所以我首先加载页面并选择说menu3,然后加载menu3很好,所有sunsequent菜单都不会加载,除非我刷新页面并再次回到开始并选择我想要的其他菜单。非常感谢您的帮助 P

4

1 回答 1

3

当您加载新内容时,您可能会覆盖菜单,因此您需要一个委托事件处理程序:

$('#centeredmenu').on('click', '[id^="menu"]', function(e) {
    e.preventDefault();
    $('#centeredmenu').load(this.id + '.php');
});

此外,带有空href 的元素会重新加载页面,您应该#在href 中使用符号并防止事件处理程序中的默认操作。

于 2013-08-28T21:12:39.940 回答