Question

我很难让iPhone OS4在DIV上，在UIWebView中生成默认的点按高亮显示（即嵌入在应用程序中，而不是在Safari中）。

标记是：

<a href="...">
<div class="item">
 <div class="imgWrapper">
   <img...>
 </div>
 <div class="Title">
  Title text
 </div>
</div>
</a>

我的目标是显示本机照片视图 - 即左侧是图像的滚动列表，后跟一些文本，列表条目由细边框线分隔。列表条目中任何位置的点击都应触发链接 - 在图像上，文本上或列表项分隔符之间的空白处。

我无法在DIV上使用onclick = location.href = ...替换元素，因为我使用自定义URL架构将点击反馈给应用程序，而location.href = doesn不要触发UIWebView委托。

这是我到目前为止所尝试的内容：

纯HTML，没有CSS - 我得到了一个点击突出显示，但文字在图像下面流动
项目宽度320px向左浮动，img向左浮动 - 点击突出显示不再出现在空白或文本上，但在图像上显示
其他一些东西！

我很难过如何在这个HTML上正确地使用水龙头突出显示 - 任何人都有任何关于如何使这个工作的想法/例子？

Answer 1

我刚刚完成一个移动网站项目，并遇到了一些类似的问题。首先，我会重新考虑你的HTML结构与div的内部锚点。我不确定是否符合HTML规范。我知道webviews和safari以及所有其他移动设备以不同的方式处理html验证，有些比其他更严格，因此请注意并确保验证您的doc类型和内容类型。内容类型仍然在页面上烧我。其次，为了让点击突出显示工作，你必须放入更高的节点，然后它只适用于我认为的锚点。所以你可以用CSS在身体上做这样的事情：

body {
    -webkit-tap-highlight-color: #ccc;
}

第三，你不能尝试onlick="window.location=your_href;"

希望这会有所帮助，或者让您了解需要注意的事项。

Answer 2

点击突出显示在元素上，该元素包含为元素注册的鼠标事件子集（例如，click，mousedown，mousemove，mouseup等）。

您可以在http://www.quirksmode.org/dom/events/tests/click.html或http://www.quirksmode.org/dom/events/tests/mouseover.html上试用（但测试仅适用于iOS5，因为测试表单具有可滚动区域）。

E.g。触摸测试页面中心底部的表单元素，然后点击突出显示，取消选中事件，现在触摸表单元素时不再点击突出显示。

Answer 3

我摆脱了像这样的点击亮点：

body {
    -webkit-tap-highlight-color: transparent;
}

如何获得--webkit-tap-highlight-color来突出显示整个DIV？

3 个答案: