<div id="ColCreate" class="fab tooltip"><span class="tooltiptext">Add Column</span>+</div>
<div id="CreateCol" class="ColCreate">
<div class="modal-content">
<div class="modal-header">
<span class="close">×</span>
<h2>Create an column</h2>
</div>
<div class="modal-body">
<label for="cname">Column Name</label>
<input id="cnamei" type="text" name="cnamei"><br>
<button onclick="finish()" class="Finish">Finish</button>
</div>
<div class="modal-footer">
<h3></h3>
</div>
</div>
</div>
<div id="container" class="container">
</div>
<script src="./index.js"></script>
<script src="./modal.js"></script>
<script src="./Drag.js"></script>
这是JavaScript
var modal = document.getElementById("CreateCol");
var btn = document.getElementById("ColCreate");
var span = document.getElementsByClassName("close")[0];
var finish = document.getElementsByClassName("Finish")[0];
var list1 = "<div><h3>"
var list2 = "</h3><ul id=\"list-1\" class=\"sortable\"><li id=\"fake\" class=\"hidden\"></li><li id=\"item-1\"><a href=\"#1\">Link 01</a></li><li id=\"item-2\"><a href=\"#2\">Link 02</a></li><li id=\"item-3\"><a href=\"#3\">Link 03</a></li><li id=\"item-4\"><a href=\"#4\">Link 04</a></li><li id=\"item-5\"><a href=\"#5\">Link 05</a></li><li id=\"item-6\"><a href=\"#6\">Link 06</a></li></ul></div>"
btn.onclick = function() {
modal.style.display = "block";
}
var finish = function() {
var x = document.getElementById("cnamei").value;
var y = document.getElementById("container");
modal.style.display = "none";
var list = `${list1}${x}${list2}`
y.insertAdjacentHTML( 'beforeend', list);
}
span.onclick = function() {
modal.style.display = "none";
}
modal.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
我想刷新JavaScript,以便进行拖动