MDN,规范以及我在Google上可以找到的每个网站都说,所有HTML元素都是可拖动的。但是,实际上,我发现即使禁用了文本输入或文本区域,我也无法将其拖动。
MDN, the spec, and every site I can find with Google says that all HTML elements can be draggable. However, in practice I find that I can't drag text inputs or textareas, even if they're disabled.
例如,使用以下代码:
<img src="www.placehold.it/350x150" draggable alt="Placeholder image"> <a href="example" draggable>Link</a> <input type="text" draggable> <input type="text" disabled draggable>我可以拖动图像和链接,但是两个输入都不能拖动。
I can drag the image and the link, but neither of the inputs can be dragged.
这里是 JSfiddle
是否可以使用HTML5 draggable属性来拖动输入?如果没有,我可以使用一种解决方法吗?
Is it possible to drag inputs using the HTML5 draggable attribute? If not, is there a workaround I could use?
推荐答案好的,所以我尝试了所有解决方案和评论,事实证明,这样做的唯一方法是使div保留注释中@james之类的其他元素。
Okay, so I've tried all the solutions and comments and it turns out that the only way to do it is to make a div that holds the other elements like @james said in a comment.
由于所有元素都应该是可拖动的根据规范,我猜测不包括对输入的可拖动支持的原因是因为它们应该自动抓住onclick的焦点。我很想知道真正的理由是什么,所以我可能会用Firefox打开一个错误。
Since all elements are supposed to be draggable according to the spec, I'm guessing that the rationale for not including draggable support for inputs is because they are supposed to grab focus automatically onclick. I'd be curious to see what the real rationale was, so I may open a bug with Firefox.
我测试过的主流浏览器都不支持可拖动的< input> 或< textarea> 元素,截至目前,该元素仅具有属性(且没有附件div)。
No major browser that I tested supports draggable <input> or <textarea> elements with only the attribute (and no enclosure div) as of right now.
规范( www.whatwg/specs/web-apps/current-work/multipage/dnd.html#the-draggable-attribute )在此问题上特别沉默。
The spec (www.whatwg/specs/web-apps/current-work/multipage/dnd.html#the-draggable-attribute) is notably silent on this issue.
更多推荐
输入和文本区域可以拖动吗?
发布评论