Question

＆＃13;

function allowDrop(ev) {
    ev.preventDefault();
}

function drag(ev) {
    ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    ev.target.appendChild(document.getElementById(data));
}

＆＃13;

<div class="notRobot">
		<div id="div1"  ondrop="drop(event)" ondragover="allowDrop(event)"></div>
		<img id="drag1" src="CLC_logo.jpg" draggable="true"
	 ondragstart="drag(event)" width="336" height="69">
		
	</div>
<input type="submit" id="submitBtn" value="Click Me!" disabled>

＆＃13;

好的，这就是我想要做的，我有一个禁用的提交按钮，作为验证选项，我想使用拖放事件来启用按钮。

因此，当我将img放入框中时，将启用提交按钮。

由于

Answer 1

在vanilla javascript中：

//Vanilla javascript way of attaching events when document is loaded
document.addEventListener("DOMContentLoaded", function(event) {
   //attach drop event to box 
   document.getElementById("yourBoxId").addEventListener("ondrop", function(){
       //re-enable submit button
       document.getElementById("yourSubmitButtonId").disabled = false;
   });
});

在JQuery中，（如果适用）

//Use JQuery's document.ready to attach drop event to your box, then re-enable button for submit
$(document).ready(function(){
    //Attach drop event
    $('#yourBoxId').on('drop', function(){
        //Re-enable submit button
        $('#yourSubmitButtonId').prop('disabled', false);
    });
});

启用提交按钮ondrop事件

1 个答案: