javascript - Firefox:无法拖动<a>超链接的子元素

考虑以下标记：<a class="link" href="#"> <sup draggable="true">Foo</sup> Bar</a>现在将dragstart事件附加到sup元素：$(document).ready(function () { $("sup").on('dragstart', function(e) { console.log('shikaka'); });});此事件将永远不会触发。我一直在研究，在Firefox中，默认情况下可拖动链接，因此我认为这可能有效：$(document).ready(function () { $(".link").on('dragstart', function(e) { e.preventDefault(); e.stopPropagation; //event return false; does not work. }); $("sup").on('dragstart', function(e) { console.log('shikaka'); });});而且，执行<a class="link" href="#" draggable="false">也不起作用。我什至尝试了一些“疯狂”的事情，例如向孩子触发事件：$(".link").on('dragstart', function (e) { e.preventDefault(); e.stopPropagation; $(this).find('sup').trigger('dragstart');});互联网上有一些帖子显示您还可以通过取消mousedown事件来禁用该事件。上面使用dragenter和mousedown进行尝试的所有示例均具有相同的效果。我的问题是，有没有办法“短路” firefox中的默认事件以使其触发子元素的事件呢？或者，是否有什么方法只能阻止父事件，但仍然能够拖动子元素？ 最佳答案 我正在测试它，如果您从href标记中删除了<a>属性，则该属性将不再可拖动，并且该事件不应触发，并且如果您想使两个元素都可拖动，则将其添加为属性，然后拖动事件将在draggable === true和子级中触发。我仍然需要<a>标记中href属性的数据，您可以将其添加为另一个属性，例如data-href或类似属性。您可以在下面的代码段中尝试。document.getElementById('a').addEventListener('dragstart', function() { console.log('Dragging a link…');});document.getElementById('span').addEventListener('dragstart', function() { console.log('Dragging a span…');});<a id="a" draggable="true"> <div id="span" draggable="true">and some more text</div></a>