0

ID中心のメニューを持つdivを含むページがあります。ページが最初に読み込まれると、div 内に 10 個のオプションを含むメニューが表示されます。これらの各オプションには、空の href リンクを持つ menu2、menu3 などの異なる名前付き ID があります。初期ロードでは、任意のメニューに変更できます。これが完了すると、他のメニューを選択して、新しいメニューで 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 が正常にロードされます。ページを更新して最初に戻り、必要な他のメニューを選択しない限り、その後のすべてのメニューはロードされません。あなたの助けは大歓迎です 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 に答える