Question

我有一个网络应用程序，它在模拟器，android和ios上工作，但在Windows手机上一个onclick事件不起作用。这是我的HTML代码：

   <ul id ="triggerresolutionbg" class="table-view">
        <li class="table-view-cell media">
        <element>
            <button class="btn btn-link btn-nav pull-left">
                <span class="icon icon-left-nav" id ="triggerLeft" onClick = "triggerText(this.id)" ></span>
            </button>
            </element>

            <button class="btn btn-link btn-nav pull-right">
                <span class="icon icon-right-nav" id ="triggerRight" onClick = "triggerText(this.id)"></span>
            </button>
            <element>
                <center id ="triggerText">After I...</center>
            </element>
        </li>
    </ul>

我正在使用Ratchet，Bootstrap和JQuery。

为什么Windows Phone上的onclick方法不起作用？

Answer 1

根据HTML5 spec for button按钮元素内的交互式内容无效。

内容模型：

短语内容，但必须没有互动内容后代。

因此，您不应期望事件侦听器处理按钮内的元素。有些浏览器违反了规范并允许这样做，但其他浏览器却没有。尝试将onclick处理程序附加到button元素本身。

由于您使用的是this.id，我建议您在此过程中重构HTML，但是这样的事情应该有效。

<button class="btn btn-link btn-nav pull-left" onclick="triggerText(this.firstElementChild.id)">
    <span class="icon icon-left-nav" id="triggerLeft"></span>
</button>

HTML onClick不适用于Windows Phone

1 个答案: