如何检查 IE Drag &放弃对任何元素的支持

2022-01-11 00:00:00 drag-and-drop internet-explorer html

有没有办法检查用户代理是否支持拖动&删除特定元素(div、tr、...)?

Is there a way to check if a user agent supports drag & drop of a particular element (div, tr,...)?

我有一个带有可拖动表格行的表格，它在 Chrome 中运行良好.但是由于 Internet Explorer(最高版本 9)只支持图像和链接(以及其他一些)的拖动，我想在表格行内给它一个小的锚点拖动句柄.我的代码如下所示:

I've got a table with draggable table rows, which works fine in Chrome. But since Internet Explorer (up to version 9) only supports dragging of images and links (and a few others), I wanted to give it a little anchor drag handle inside the table row instead. My code looks something like this:

<table>
    <tr draggable="true">
        <td><a class="drag-handle"></a> Hello World</td>
    </tr>
</table>

JS/jQuery:

$('tr[draggable]').each(function() {
    // Remove draggable="true" from <tr>
    $(this).attr('draggable', '');
    // Add draggable="true" to <a class="drag-handle">
    $(this).find('.drag-handle').attr('draggable', 'true');
});

显然，要真正完成这项工作还有很多工作要做，但要点是:如果用户的客户端不支持拖动 a (IE<10)，则给用户一个拖动的东西.

Obviously, there is a lot more to do to actually make this work, but you get the gist: giving the user a drag thingy if their client doesn't support dragging of a (IE<10).

现在我只想在用户的客户端不支持拖动表格行的情况下进行替换.是否有任何已知的特征检测?

Now i want to do the replacement only if the user's client doesn't support dragging of table rows. Is there any known feature detection for that?

推荐答案

来自 检测 javascript 中的 HTML5 拖放支持:

if('draggable' in document.createElement('span')) {
    alert("Drag support detected");
}

感谢 Mark Rhodes 的提示！还要感谢 micha 指出我的 jQuery 错误 (removeAttr('draggable') 而不是attr('draggable')).

Thanks to Mark Rhodes for the tip! Also thanks to micha for pointing out my jQuery error (removeAttr('draggable') instead of attr('draggable')).

相关文章