Javascript 将外部图像拖动到div中时,如何更改默认工具提示?
我正在上传图像,方法是将图像从磁盘拖到Javascript 将外部图像拖动到div中时,如何更改默认工具提示?,javascript,drag-and-drop,tooltip,Javascript,Drag And Drop,Tooltip,我正在上传图像,方法是将图像从磁盘拖到div。这一点已经完成 我想做的是以某种方式配置当拖动的图像位于拖放区域时显示的默认工具提示 更具体地说,我想用我自己的文本替换Move: 任何关于如何使用纯JavaScript(或其他)实现这一点的建议,或者即使是可能的,都将非常有用 这是我的JavaScript代码。在某个时刻,我将这个元素注入DOM。重申一下,此功能工作正常,只是我想更改工具提示中的默认文本,当我将图像拖到此元素上时,该文本将显示(如上图所示) 提前谢谢。投票失败的原因是什么?这是一
div
。这一点已经完成
我想做的是以某种方式配置当拖动的图像位于拖放区域时显示的默认工具提示
更具体地说,我想用我自己的文本替换Move
:
任何关于如何使用纯JavaScript(或其他)实现这一点的建议,或者即使是可能的,都将非常有用
这是我的JavaScript代码。在某个时刻,我将这个元素注入DOM
。重申一下,此功能工作正常,只是我想更改工具提示中的默认文本,当我将图像拖到此元素上时,该文本将显示(如上图所示)
提前谢谢。投票失败的原因是什么?这是一个真正的问题。如果您需要信息,请让我知道,而不是无缘无故的匿名否决票。您的代码是什么?你能发布你需要帮助的工作示例吗?这是一个非常模糊的/开放式的问题,有多种可能会出现错误的地方。@Rikin添加了代码(如果有帮助的话)。至少这告诉我,您正在尝试创建元素并使用实用工具连接代码。有了这些,你可以发布你正在尝试的工具和插件。您的问题可能与它的默认值有关/behavior@Rikin顺便说一句,在google drive等其他服务上也观察到了同样的行为。当您将外部文件拖动到浏览器中时,“移动”工具提示将显示在悬停在可拖放区域上。这似乎不是我的特定代码或框架的问题,它看起来像是一种通用行为,可能是可配置的,也可能不是可配置的(我当然希望它是可配置的)。
var imageHolderDiv = UWA.createElement('div', {
'id': 'uploadImageButton',
'class': 'uploadImageButton',
'styles': {
'width': '104px',
'height': '104px',
'vertical-align': 'top'
},
'events': {
dragenter: function(event) {
counter++;
imageHolderDiv.classList.remove('uploadImageButton');
imageHolderDiv.classList.add('somethingIsDraggedOverMe');
}.bind(this),
dragleave: function(event) {
counter--;
if (counter == 0) {
imageHolderDiv.classList.remove('somethingIsDraggedOverMe');
imageHolderDiv.classList.add('uploadImageButton');
}
}.bind(this),
dragover: function(event) {
imageHolderDiv.classList.add('somethingIsDraggedOverMe');
//kill any default behavior
event.stopPropagation();
event.preventDefault();
}.bind(this),
drop: function(event) {
//kill any default behavior
event.stopPropagation();
event.preventDefault();
imageHolderDiv.classList.remove('somethingIsDraggedOverMe');
imageHolderDiv.classList.add('uploadImageButton');
var file = event.dataTransfer.files[0];
var that = this;
if (file && file.type.match('image.*')) {
MyWebServices.uploadImage({
file: file,
fileName: file.name
onComplete: function(res, args) {},
onFailure: function() {}
);
}
else {
//if its not an image
}
}.bind(this)
}
});
});