0

jQuery を使用して、ユーザーがページの読み込みを確認せずに外部ページを現在のページに読み込もうとしています。

#contentページ「info.php」を呼び出すと、 divに読み込まれます。それがスクリプトが行うべきことです。問題は、スクリプトとdivを含むメインページに、#content誰かがページにアクセスしたときに実行し、外部ページから呼び出されないようにするコードが既にあることです。これは機能していますが、メニューのリンクの 1 つをクリックすると、最初のコンテンツに戻ることができません。

ここに私のコードの例外があります:

<script>
$(function() {
   $('#nav a').click(function() {
    var page = $(this).attr('href');
    $('#content').load(page + '.php');
    return false;
    });
});
</script>

<ul id="nav">
<li><a href="#">Page1</a></li>
<li><a href="about">About</a></li>
<li><a href="contact">Contact</a></li>
<li><a href="info">Info</a></li>
</ul>

<div id="content">
Here I have some code that I wanted to be attributed to the "Page1"
</div>
4

2 に答える 2

0

私は load() にあまり詳しくありませんが、この場合は ajax を使用してページを更新せずにロードする必要があると思います。

var page = $(this).attr('href');
$.ajax({
  url: page + '.php',
  success: function(data)
  {
     $('#content').html(data);
  }
})

編集:「メニューのリンクの 1 つをクリックすると、最初のコンテンツに戻ることができません」と言われましたが、div #content 内にコードがあり、そのコンテンツを上書きした onclick という意味ですか? ?

于 2012-09-21T07:22:48.740 に答える
0

次に例を示します。

$(function()
{
   var content = $('#content');

   $('#nav a').click(function(e) {
       e.preventDefault();
       var page = $(this).attr('href');

       content.children().hide();
       var pageContent = content.find("#" + page);
       if(pageContent.length > 0)
       {
           pageContent.show();
       }
       else // put ajax here
       {
           content.append($('<div>').attr('id', page).text('New page ' + page));
       }
   });
});

デモ: jsfiddle.net/3jLjw/

于 2012-09-21T09:36:09.783 に答える