我想设计一个拖放属性来填充给定选项的空白，例如:-
问:他是一个__男孩。
选项:
A。好
b.坏的。
在此用户将能够选择选项并将其放在空白处。并且选项不应该在列表中，而应该在 div 中。
<script>
$(function() {
$("#sortable1, #sortable2").sortable({
connectWith: ".connectedSortable"
}).disableSelection();
});
</script>
</head>
<body>
<div id="sortable1" class="connectedSortable">
This is a <div >_______</div> story
He is a <div>_______</div> boy.
Food is <div >________</div> here.
</div>
<b>option</b>
<div id="sortable2" class="connectedSortable">
<div >good</div>
<div >bad</div>
<div >lousy</div>
<div >nice</div>
<div >awesome</div>
</div>
最佳答案
最好使用 jQueryUI 来实现拖放功能，而不是编写自己的插件。这是您问题的解决方案。
http://jsfiddle.net/ayniam/4aMhr/
<html>
<head>
<title>jQuery UI Droppable - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
$(function() {
$( "#draggable1" ).draggable();
$( "#droppable" ).droppable();
$( "#draggable2" ).draggable();
});
</script>
</head>
<body>
<div>He is a <div id="droppable" style="display:inline"> __________________ </div></div>
<div id="draggable1">
<p>boy</p>
</div>
<div id="draggable2">
<p>girl</p>
</div>
</body>
</html>
但是，我对单个 id 选择器使用了函数表达式，如果你想使用多个 id 选择器，请看看这个
希望能解决您的问题。
关于javascript - 使用 jquery 或 java 脚本中的拖放功能填充空白，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22163540/