Fatal编程技术网
  • javascript/
  • Javascript 使用js在html中创建拖放

Javascript 使用js在html中创建拖放

javascript html css

Javascript 使用js在html中创建拖放,javascript,html,css,drag-and-drop,draggable,Javascript,Html,Css,Drag And Drop,Draggable,我希望每个人在这艰难的时刻都能做得很好。 我正在为标签打印演示创建一个HTML模板。 我想创建拖放功能到这个页面，这只能通过JavaScript获得，我甚至是新的HTML。 我知道这是一个愚蠢的问题，但我真的需要这个功能，因为它已经花了我这么多时间没有结果。如果你能告诉我或指导我如何做到这一点，那将是非常有帮助的 !DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta

我希望每个人在这艰难的时刻都能做得很好。 我正在为标签打印演示创建一个HTML模板。 我想创建拖放功能到这个页面，这只能通过JavaScript获得，我甚至是新的HTML。 我知道这是一个愚蠢的问题，但我真的需要这个功能，因为它已经花了我这么多时间没有结果。如果你能告诉我或指导我如何做到这一点，那将是非常有帮助的

!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Label Printer</title>
<style>
    body {
        display: block;
        max-width: 29.7cm;
        margin-left: auto;
        margin-right: auto;
        margin-top: 0;
    }
    div{
        width: 49.2%;
        height: 3.7125cm;
        float: left;
    }
</style>
</head>
<body>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div><p>michael richardson<br>1 arbitrary road<br>coningsby ,&nbsp; Lincolnshire&nbsp;<br>IX14YY&nbsp;<br>United Kingdom<br></p></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <style media="print">@page {margin-top: 0;margin-left: 3cm;margin-right: 0;margin-bottom: 0;}</style>
</body>
</html>
你需要看看 最重要的是使用以下方法设置和访问数据：

和

例如：

一段时间前，我创建了一个使用拖放功能的小型vanilla JS TaskManager项目。您可以在以下内容中参考相同内容：

函数drop对您尤其有用。查看它

您可以使用第三方JS库吗？如果是，德拉古拉是一个非常好的选择@ArpitTyagi谢谢，这真的很好，但是有没有一种简单的方法只使用少量的js。这可能会有所帮助。