我有一个基本的jquery / javascript问题。
下面的代码将创建可以拖放的对象。如果单击某个对象,它将显示“下一个”对象的ID。
我希望在首次“抓取”对象时(在没有故意点击的情况下拾取)返回此值(下一个对象的ID),然后返回放置它的“下一个”对象的ID。
理想情况下,如果抓取的位置的ID等于放置位置的ID,则不应返回任何ID。
Jquery&的Javascript
$(function() {
$( "#sortable" ).sortable();
$( "#sortable" ).disableSelection();
});
$("li").live("click",function(e) {
document.getElementById("result").innerHTML=($(this).next("li").attr('id'))
});
CSS:
#sortable { list-style-type: none; margin: 0; padding: 0; }
#sortable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 100px; height: 90px; font-size: 4em; text-align: center; }
</style>
HTML:
<div class="container">
<ul id="sortable">
<li id="li1" class="ui-state-default">1</li>
<li id="li2" class="ui-state-default">2</li>
<li id="li3" class="ui-state-default">3</li>
<li id="li4" class="ui-state-default">4</li>
<li id="li5" class="ui-state-default">5</li>
<li id="li6" class="ui-state-default">6</li>
</ul>
</div>
<br><div id="result">Result Placed Here</div>
我甚至不知道从哪里开始,因为我不知道如何在没有点击的情况下运行该功能(没有抓取)。
非常感谢任何帮助,
泰勒
可以在这里找到JSfiddle: http://jsfiddle.net/TSM_mac/uuHsg/4/
答案 0 :(得分:0)
使用sortable events start
和stop
。
$(function() {
function startCallback(event, ui) {
// stuff
}
function stopCallback(event, ui) {
// other stuff
}
$("#sortable").sortable({
start: startCallback,
stop: stopCallback
}).disableSelection();
});