在javascript中拖放页面上的按钮

时间:2017-04-17 19:24:22

标签: javascript jquery html

我正在尝试创建可以在整个页面中移动的按钮,但我尝试的一切都不适合我。 即使在Move buttons on a page using JavaScript上运行示例 不起作用。

到目前为止,我的javascript文件只能创建我需要的按钮:

function add(text) {
console.log("New button with text: "+ text);
var word = document.createElement("button");
word.type = "button";
word.id = "magnet";
word.draggable = true;
word.value = text;
word.onclick = "dragstart(event);";
var fridge = document.getElementById("poem");
//fridge.appendChild(word);
word.appendChild(document.createTextNode(text));
fridge.appendChild(word);

$("#addbutton").val(""); }

有人可以解释如何使用clientX和clientY移动按钮吗?

这是我的html文件...

<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script src="poetry.js" type="text/javascript"></script>
    <link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
    <input type="text" id="addbutton">
    <button type="button" onclick="add(addbutton.value);">Add Word</button>
    <div id="poem"></div>
</body>

0 个答案:

没有答案