如何解决DukeScript中的拖放问题？
如何解决DukeScript中的拖放问题？
提问于 2015-08-31 13:20:46
目标是，如果您将图片从一个部分(#rightbox)拖到另一个部分(#左侧框)并删除它，那么文本将出现在文本字段中。
到目前为止，我的HTML：
<body>
<section id="leftbox" data-bind="event: {drop: $root.writeText}">
</section>
<section id="rightbox">
<img id="pic" src="some_path...">
</section>
<section id="resultbox">
<input data-bind="textInput: message">
<button type="button" data-bind="click: $root.writeText">Text!</button>
<button type="button" data-bind="click: $root.reserText">Reset</button>
</section>
</body>这不管用..。但是，如果我将事件'drop‘替换为'mouseover'，那么如果我将鼠标移动到#leftbox区域，那么函数'writeText’将被触发。
为什么下降没有触发函数？(额外的问题是，如果事件被称为on..something.，那么为什么我们必须使用例如“onmouseover”而不是只使用“mouseover”)
非常感谢！
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-08-31 23:48:43
简单的解决方案是在您的左框中添加"ondragover="event.preventDefault()"“。那么，它应该能发挥作用：
我复制但并不完美的解决方案：
<section id="rightbox" data-bind="event: {drag: setDragText.bind($data, 'my dragText 1'), dragend: setDragText.bind($data, '')}">
<img id="pic" draggable="true" src="img src 1">
</section>
<section id="rightbox" data-bind="event: {drag: setDragText.bind($data, 'my dragText 2'), dragend: setDragText.bind($data, '')}">
<img id="pic" src="img src 2">
</section>
<section id="leftbox" ondragover="event.preventDefault()" data-bind="event: {drop: setMessageWithDragText}">
Some section content.
</section>
<section id="resultbox">
<input data-bind="textInput: message">
<button type="button" data-bind="click: writeStandardMessage.bind($data, 'Nothing dragged!')">Text!</button>
<button type="button" data-bind="click: resetText">Reset</button>
</section>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32312289
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号