锚标记跳到哈希不工作
我已阅读关于此主题的各种帖子,并认为我了解通常的失败点。我发现我的两个产品缩略图图像位于“This Click'n'Pick Set Consistency of The following 2 Products”标题下,可点击,但不要带我到页面下方的名为<div>
的元素。例如,它们导致导航到http://www.premierrange.co.uk/#bundle_product_anchor_448。我在Chrome浏览器(18.0.1025.33 beta)和Firefox(10.0.1)上看到了这一点。锚标记跳到哈希不工作
http://www.premierrange.co.uk/index.php?main_page=clicknpick&groups_id=2&chosen_0=243&chosen_1=448
因此,例如,有一个锚定位 '#bundle_product_anchor_243':
<a href="#bundle_product_anchor_243" title="Click here to jump to the 70cm Truly Curved Black Glass Curved Cooker Hood H77-7B">
<img src="http://www.premierrange.co.uk/thumbnailer.php?filename=images/H77-700.jpg&height=100" alt="70cm Truly Curved Black Glass Curved Cooker Hood H77-7B">
</a>
这进一步瞄准<div>
下来的页面:
<div class="productSeparator" id="bundle_product_anchor_243">
<h1>Product number 1 in this bundle of 2 products</h1>
</div>
我也试图使目标<div>
内的<h1>
代替目标,如果目标必须是内联元素而不是div,但似乎没有任何工作。
包含错误行为的<div>
在包含目标元素的<div>
出现在文档中时完全关闭。我不认为在浏览器解析<a>
的时间点目标元素没有被定义。
手动在URL中添加“#bundle_product_anchor_448”确实有效。
我知道,由于大量的因素,我无法轻松解决该页面的大量页面的HTML验证失败。我一直认为这个基本的'跳转到命名元素'功能应该工作。除了这个小小的导航怪癖之外,该页面功能完全正常。
任何人有任何线索?
尝试从页眉中删除<base href="http://www.premierrange.co.uk/"></base>
。
<base>
标记指定页面上所有相对URL(不包括http://www.example.com/ ......)的基URL或目标。没有它,你的链接应该按照预期工作,尽管你可能需要修复其他链接来适应这种变化。
当使用在应用程序中<base>
标签,最好的办法是只使用绝对URL的散列之前,用绝对URL指向你在同一页。
因此,假设你是“http://example.com/products/curved-glass”页面上,而不是
<a href="#bundle_product_anchor_243">...
你需要包括散列之前的绝对当前网址:
<a href="http://example.com/products/curved-glass#bundle_product_anchor_243">...
在大多数环境中查找当前URL是一项微不足道的任务,并且此方法还可以避免删除您的<base>
标记,这些标记可能会对应用程序的其他方面产生负面影响。
谢谢Q.表(如果这是你的真名)..删除' '标签会立即解决问题。我需要基本标记,因为我使用的SEO模式允许像http://server.com/hobs/30cm/funky-hob这样的URL。它实际上是从/index.php重写和提供的,并且该页面包含许多资源引用到指定的服务器根目录,没有前导'/'..样式表,缩略图脚本等等..所以我必须非常仔细地解决这个问题。无论如何,好的提示,回答我的问题,谢谢。 –
Neek
2012-02-23 06:19:08