html - 为什么 Windows Phone(7 或 8)允许点击 divs？

Question

当两个 html 元素位于彼此之上且后面的元素包含 anchor 标记时，WP7 和 8 上的 IE“点击通过”顶部元素并单击 anchor 。

包括 IE 在内的桌面浏览器和其他移动设备(如 Android 浏览器和 Mobile Safari)没有此行为。

html

<div class="back">
    <a href="mypage.html">Min sida</a><br />
    <a href="mypage.html">Min sida</a><br />
    <a href="mypage.html">Min sida</a><br />
    <a href="mypage.html">Min sida</a><br />
    <a href="mypage.html">Min sida</a><br />
</div>
<div class="front">
</div>

CSS

.back
    {
        position: absolute;
        top:0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 1;
    }

    .front{
        position: absolute;
        top:0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 2;
        background-color: rgba(255, 0, 0, 0.5);
    }

以下 jsfiddle 显示问题:http://jsfiddle.net/BSunW/6/

这是预期的行为吗？有什么方法可以改变这种行为吗？

Answer 1

我在自定义 Foundation 4 选择框时遇到了同样的问题。我所做的是我已经捕获了下拉列表下方元素的所有点击(这是一个 .footer-ul div)，如下所示:

 wp8fix: function() {
        $('.dropdown').click(function(){
            $('.foooter-ul').bind('click',function(e){
                e.stopPropagation();
                return false;
            });
        });
 }

当你不再需要它的时候，一定要记得解绑

$('.foooter-ul').unbind('点击');