HTML onClick不适用于Windows Phone

Question

我有一个在模拟器，android和ios上都可以使用phine的Web应用程序，但是在Windows Phone上，一个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规范，将按钮中的交互式内容放入按钮元素中是无效的。

内容模型：

设定内容的内容，但必须没有交互式内容的后代。

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

由于您使用的是this.id ，因此我建议您在此过程中重新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>