Drag and Drop between two select Objets
Move one element and you will see the select objects follow the element drap or drop
Home
- You must load the javascript DragAndDrop.js
- In your HTML page put on tag body
<body οnlοad="_initDragEtDrop(event)">
- In your HTML page you must create one div 't1' where you want to print the Drag and Drop
<div id="t1" > < /div>
- In your HTML page you must load the script "DragAndDrop.js" with instruction :
<script src="DragAndDrop.js" type="text/javascript" language="javascript"></script>
- In your page HTML you must have 2 tags <select> named "drag" and "drop", like this
<select name="drag" .... >
<select name="drop" .... > - If you want put a "Reset Button", you can use the function ResetDragAndDrop(event), like this
<input type="button" value="reset" on click="ResetDragAndDrop(event)" />
An example
<html>
<head>
</head>
<body οnlοad="_initDragEtDrop(event)">
<div id="t1">
<br>
<br>
<br>
<br>
Drag et Drop
</div>
<form>
<div style="display: none; visibility: hidden">
<select name="drag" >
<option value="bon">bon</option>
<option value="aimable">aimable</option>
</select>
<select name="drop">
<option value="mauvais">mauvais</option>
<option value="drole">drole</option>
</select>
</div>
<input type="submit" οnclick="print_your_choice('drag'); print_your_choice('drop')"/>
</form>
<script type="text/javascript">
function print_your_choice(elem)
{
var select=document.getElementsByName(elem)[0];
var o=select.options;
var v=' ';
for (i=0;i<o.length;i++) {
v=v+' '+o[i].value;
}
alert(elem+'='+v);
}
</script>
<script src="DragAndDrop.js" type="text/javascript" language="javascript"></script>
</body>
</html>
3294
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
