Question

我创建了一个简单的html网页。用户需要选择1.23之类的文本，然后将其拖放到另一个浏览器中。这一切都很完美。（我不需要编写任何代码来实现这一点。我认为这是浏览器内置功能的一部分。）

我需要将这个数字四舍五入到1.5。我没有麻烦做四舍五入，但是如何在拖动期间捕捉（并更改）值？我不想在第一个浏览器中更改值，它需要保持为1.23 ...我只需要在之间进行舍入拖动启动和删除，进入第二个浏览器窗口。

能做到吗？我会发布一些代码，但就像我说这一切都没有任何代码...除了＆＃34;更改而拖动部分＆＃34;。

我宁愿编写自己的代码，不拖动大量代码库，例如jquery只是为了这个小小的功能。

Answer 1

也许您可以在启动时尝试更改浏览器中的文本，并在删除后将其还原回来？尝试这样的事情：

https://jsfiddle.net/Domination/4zejjygk/1/

HTML：

<div id="dragEl" draggable='true'>1.5343</div>

JS：

//This is the element
dragItem = document.getElementById("dragEl");

//This is the event that changes it when mouse is over
dragItem.addEventListener("mouseover", HandleStart);

//These are events that change it back when the dragging is finished
dragItem.addEventListener("mouseout", HandleEnd);
dragItem.addEventListener("dragend", HandleEnd);
temp = dragItem.innerHTML;

//This is launched when it is hovered over
function HandleStart(e){
    e.preventDefault();
    text = e.target.innerHTML
    rounded = Math.round(Number(text)*10)/10; //Rounds the number to two decimal places
    e.target.innerHTML = rounded; 
}

//This is launched when dragging has finished
function HandleEnd(e) {
    e.preventDefault();
    e.target.innerHTML = temp; //Reverts to original
}

如果您可以访问要拖动的其他页面，您可以像Ivan建议的那样进行操作，并在您放置它的部分使用ondrop事件...

https://jsfiddle.net/Domination/tgy7xgvx/1/

HTML / JavaScript拖放但在拖动过程中更改文本？

1 个答案: