私のサイトには、さまざまなhtmlファイルへのリンクを含む「nav」div、静的情報を含む「sidebar」div、およびさまざまなhtmlファイルがロードされる「content」divがあります。また、ヘッダーにURLベースを設定しました。これらのhtmlファイルの1つは長いドキュメントであり、このファイルのセクションへのリンクを含めることができるようにしたいと思います。そこで、セクションヘッダーに名前を付け、ハッシュタグを使用してそれらにリンクしました。
Portfolio.htmlスニペット:
<BODY>
<a id="top"></a>
<header>
<a href="#pulseox">PULSE OXIMETRY IN ZAMBIA</a><BR>
<a href="#dengue">DENGUE DIAGNOSIS IN NICARAGUA</a><BR>
<a href="#retina">EYE HEALTH IN INDIA</a><BR>
<a href="#mas531">MAS.531 COMPUTATIONAL CAMERA AND PHOTOGRAPHY</a><BR>
<a href="#mass60">MAS.S60 HANDS ON FOUNDATIONS</a><BR>
<hr>
</header>
<header><a id="pulseox">PULSE OXIMETRY IN ZAMBIA</a></header>
<img src="pulseOx.PNG" width="500px"><BR>
lorem ipsum
</BODY>
そして、これは私がhtmlを単独で開いたときに素晴らしい働きをします。しかし、それがメタhtmlファイル内の「content」divにロードされると、それは私をに連れて行こうとします<myurlbase>#pulseox
。<a href="#pulseox">
リンクに「content」div内のhtmldocを参照させるにはどうすればよいですか?Portfolio.htmlファイルにベースURLを設定していません。
これが私のメタHTMLドキュメントです。
<HTML>
<HEAD>
<link rel="stylesheet" type="text/css" href="index_test.css" />
<base href="http://myurl/" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#content").load("home.html");
$(".nav-1").click(function(){
$("#content").load("home.html");
});
$(".nav-2").click(function(){
$("#content").load("about.html");
});
$(".nav-3").click(function(){
$("#content").load("portfolio.html");
});
$(".nav-4").click(function(){
$("#content").load("cv.html");
});
});
</script>
</HEAD>
<BODY>
<div id="nav">
<ul>
<li><a class="nav-1">HOME.</a></li>
<li><a class="nav-2">ABOUT.</a></li>
<li><a class="nav-3">PORTFOLIO.</a></li>
<li><a class="nav-4">CV.</a></li>
</ul>
</div>
<div id="sidebar">
myname
<BR><BR>
</div>
<div id="content"></div>
</BODY>
</HTML>