私はindex.html
という名前のページがあります。その上で、私は以下の2つのオプションを持つメニューありますAJAXの読み込み機能、ページの特定のセクションを表示するためのコードです
┏━━━━━━━━━━━━━┳━━━━━━━━━━━━━━━━━┓ ┃ Classes ┃ Update calendar ┃ ┗━━━━━━━━━━━━━┻━━━━━━━━━━━━━━━━━┛
をそして私は私がコンテンツページの置く空div
ありますもあります
<div id="content"></div>
をメニューオプションを管理する外部JavaScriptファイル(menu.js
)。 (以下コード)
は次に、calendar.php
に私は2つのコントロールを格納する:カレンダーとログインフォーム。 (以下コード)
アイデアがある:ユーザーがUpdate calendar
オプションをクリックしたときに
- 、
calendar.php
はdiv
内容にロードされますが、唯一のログインフォームが表示されます。 Classes
オプションをクリックするとcalendar.php
のコンテンツにはdiv
というコンテンツがロードされますが、のカレンダーだけが表示されます。
私は現在、$(selector).load(url)
をロードしてcalendar.php
(下記参照)を使用しています。
予想通りUpdate calendar
オプションが機能し、
が、私は両方のカレンダーとログインフォームが表示さClasses
、をクリックしてください。
menu.js
<script type="text/javascript">
$(document).ready(function(){
var sections = $("#menu li");
var loading = $("#loading");
var content = $("#content");
sections.click(function(){ //When the user clicks an option...
showLoading(); //show the loading bar
switch(this.id) {
case "classes"://if the Classes option is clicked...
content.load("calendar.php", hideLoading); break;
case "classes_update"://if the Update calendar option is clicked...
content.load("calendar.php #section_update", hideLoading); break;
default: //if nothing is clicked...
hideLoading(); break;
}
});
});
</script>
calendar.php
<head>
<!-- links to JQuery resources -->
<script type='text/javascript'>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
}
});
});
</script>
<!-- other calendar styles -->
</head>
<body>
<div id="calendar"></div> <!-- calendar area -->
<div id="section_update"> <!-- login form area -->
<!-- form stuff -->
</div>
</body>
私はあなたの問題を人々が理解できるように**あなたの質問を書き換えました**。 **、** **を見直して間違ったことを修正してください。 –
jmendeth:ありがとう!私はあなたにこれを手伝って時間を割いてくれて本当にありがたいです。うわー!このコミュニティには、私の質問を再フォーマットするために余分な距離を尽くすことを望んでいる素敵な人々がいます!ありがとうございました! – user765081