私は index.html ページを持っています:
<body>
<ul>
<li><a id="page" href="#">About</a></li>
</ul>
<div id="show">
</div>
</body>
jQuery:
<script type="text/javascript">
$(document).ready(function(){
$("#page").click(function(){
$('#show').load('test.html');
});
});
</script>
#show div で test.html のコンテンツを表示する必要がありますが、上記のコードは機能しません。
だから私の質問は:私は何を間違えたのですか?
PS: リンクから jQuery 1.9.1 ライブラリを使用し<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
ており、他の jQuery スクリプトで動作します。
編集:
気にしないでください、iFrameを使用して他のWebページ/Webサイトのコンテンツ、jQueryを表示しました:
jQuery(document).ready(function($) {
$(".faq").click(function () {
$("#loader").fadeIn(10);
$("#content").delay(800).fadeIn(200);
$("#mainFrame").attr("src", "http://www.wordpress.org");
});
$(".other").click(function () {
$("#loader").fadeIn(10);
$("#content").delay(800).fadeIn(200);
$("#mainFrame").attr("src", "http://www.othersite.com");
});
$("#hide").click(function () {
$("#loader").css("display", "none");
$("#content").fadeOut(200);
setTimeout(function(){
$("#mainFrame").attr("src", "about:blank");
}, 250);
});
});
および HTML:
<ul>
<li><a class="faq" href="#">Show</a></li>
<li><a class="other" href="#">Show</a></li>
</ul>
<div id ="loader"></div>
<div id="content">
<input type="button" id="hide" value="hide"></button>
<iframe src="" scrolling="no" frameborder="0" id="mainFrame" name="mainFrame"></iframe></div>