我正在创建一个拖放页面，其中可拖动的框包含由sql表填充的内容。一旦一个框被拖走，它就会消失，而一个新的框则会显示新的数据。
我只想一次出现15个框，但我不知道如何使用SQL来做到这一点，因为框的拖放发生在加载之后，所以php对我没有帮助——我需要在页面加载之前将框名称列表预加载到js数组中吗？这是否意味着我的整个名单都会暴露在公众面前？
我已经使用xml表编写了这篇文章，并且正在迁移到sql。这是我编写的函数，每次JQuery丢弃事件发生时都会调用它：
function AddNextSkill() {
var div = document.getElementById('productbox');
div.innerHTML = div.innerHTML + '<div class="product" id= "box' + RunningCount +' "><h4>' + MyToolList[RunningCount][1] + "</h4></div>";
RunningCount += 1;
$("#productbox .product").draggable({//JQUERY DETAILS//}
});
在这种情况下，我在JS MyToolList[I][j]中制作了一个预加载的数组，其中包含工具及其id的列表。
这样做效率低吗？使用sql而不预加载任何表会更好吗？
我通过以下操作解决了这个问题：
我创建了一个AJAX调用，它只返回表中的下一行（带有
LIMIT $_GET[rownum], 1
调用。然后，每次发生drop事件时，我都调用这个AJAX调用。唯一的诀窍是，你必须重新建立新的盒子作为可丢弃的。
function AddNewRow() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var div = document.getElementById('productbox');
div.innerHTML = div.innerHTML + xmlhttp.responseText;
}
}
xmlhttp.open("GET", "AddNewTool.php?rownum=" + RunningCount, true);
xmlhttp.send();
$("#productbox .product").draggable({//JQUERY DETAILS//}
});