touchStart事件和queryCommandState延迟问题

问题描述 投票:0回答:1

我正在使用contentEditable的iOS编辑器中工作。因此,要知道一些HTML元素是什么,我正在使用document.queryCommandState()。这很好用,但是在使用touchstart事件时实际上似乎有一个延迟:

$('#editor').bind('touchstart', function(e) {
    $('#debug').text('touched');

    if (document.queryCommandState('bold')) {
        $('#debug').text('bold');
    }
    if (document.queryCommandState('italic')) {
        $('#debug').text('italic');
    }

});

HTML:

<div id="editor" contenteditable="true">

    <p>This is <strong>bold text</strong>.</p>
    <p>This is <em>italic text</em>.</p>

</div>
<div id="debug"></div>

[在设备或iOS模拟器上进行测试时,当触摸粗体时,调试正确地指出该元素已被触摸,但并没有说它是粗体。仅第二次触摸它会注册为粗体。

因此,似乎在使用queryCommandState()时会有延迟。如果您在斜体和粗体之间来回轻按,则只会显示以前的样式。例如,先点按粗体然后斜体会说粗体,再点按粗体会说斜体。

演示(确保您在iOS上进行测试):http://f.cl.ly/items/3W2A0q451Q00401t3E3G/test.html

有任何延迟的地方发生了什么吗?

javascript ios mobile-safari dom-events contenteditable
1个回答
0
投票

touchstart事件的延迟是“有机”。该设备具有很小的机会来决定应在应用程序/浏览器中进行触摸(香草触摸)还是在操作系统中进行触摸(四指轻扫以在打开的应用程序之间进行切换)。自然地,后者的处理必须没有副作用-如果您用四指轻扫,就不想在基础内容上触发一两次触摸。

如果您必须规避此行为,请考虑专门解决此问题的a broad polyfillFastClick library

© www.soinside.com 2019 - 2024. All rights reserved.