[英]Why is my anchor tags not working properly?
So I went ahead an answered my own question and created a TOC, which works, it spits out everything I wanted, accept the anchor tags don't work. 因此,我回答了我自己的问题,并创建了一个TOC,该TOC可以运行,吐出我想要的所有内容,接受锚标签不起作用。 it will not jump down the page to where the appropriate h1-6 tags are. 它不会将页面跳到适当的h1-6标签所在的位置。
I have the following php: 我有以下php:
public function table_of_contents(&$content, $HeaderParameter){
//Creat Empty variables
$HeaderNums = "";
$ContentLink = "";
$IndentLast = 1;
//Creates a single string of header identifier. eg: "1234"
foreach($HeaderParameter as $Num){
$HeaderNums.= $Num;
}
//Setup header to search for our headers specified by user
if (preg_match_all('/<h(['.$HeaderNums.'])(.*?)>(.*?)(<\/h['.$HeaderNums.']>)/', $content, $Result)){
// Start Table
$ContentLink.="<ul id='TB_UL'>";
// Go through each result and add to our list
foreach ($Result[0] as $key => $title){
//Get header text
$HeaderText = strip_tags($Result[0][$key]);
// If user assign an ID then get it so that we can add our on
$TagIdRegexOutput = split('"',$Result[2][$key]);
// Check if user has already set an id, if so use theres
if($TagIdRegexOutput[0]){
$TagRef = $TagIdRegexOutput[1];
}
else{
$TagRef = $HeaderText;
}
//Set a level.
$IndentPosCurrent = $Result[1][$key];
//Create link to header
$ContentLink.='<li class="TB_Level' . $Result[1][$key] .'"><a class="TB_Link" href="#'.$TagRef.'">'.$HeaderText.'</a>'.'</li>';
// Create header tag
$HeaderTag = "h".$Result[1][$key];
// Replace header in content with our assign id
$content = str_replace($Result[0][$key], "<$HeaderTag"." id='$TagRef' ".">$HeaderText</$HeaderTag>", $content);
}
// End List
$ContentLink.="</ul> <!-- TB_Main-->";
}
echo $ContentLink;
}
Which spits out html like such: 像这样吐出html:
<ul id="TB_UL">
<li class="TB_Level1"><a class="TB_Link" href="#Test">Test</a></li>
<li class="TB_Level2"><a class="TB_Link" href="#More Test">More Test</a></li>
</ul>
The #Test and #More Test are: <h1>Test</h1>
and <h2>More Test</h2>
#Test和#More测试是: <h1>Test</h1>
和<h2>More Test</h2>
Any thoughts? 有什么想法吗?
Either add an anchor tag to the correct position in the HTML or use id
s: 将锚标记添加到HTML中的正确位置,或使用id
:
Anchor: 锚:
<h1><a name="Test">Test</a></h1>
ID: ID:
<h1 id="Test">Test</h1>
EDIT: I would suggest the second approach, as I believe the name
attribute is no longer valid for anchor tags in HTML5: http://www.w3.org/html/wg/drafts/html/master/obsolete.html#obsolete-but-conforming-features (thanks to @Alohci for providing the link below). 编辑:我建议第二种方法,因为我认为name
属性对于HTML5中的锚标记不再有效: http : //www.w3.org/html/wg/drafts/html/master/obsolete.html#obsolete -but -conforming-features (感谢@Alohci提供下面的链接)。 On the other hand, if you have to support a lot of users on REALLY old browsers, the first one is preferable. 另一方面,如果您必须在真正的旧浏览器上支持很多用户,则最好使用第一个。
#
-links go to an anchor tag: #
-链接转到锚标记:
<a name="Test">Anchor</a>
<a href="#Test">Go to Anchor</a>
You don't have any in that output. 该输出中没有任何内容。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.