Dau*_*aud 10 html css jquery jquery-ui jquery-ui-sortable
虽然jQuery sortable widget在大多数情况下工作正常,但在一个情况下ordered list,numbering gets botched up when we drag an element.以下是一个示例程序来说明这一点:
<!DOCTYPE html>
<html>
<head>
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery-ui-1.8.16.custom.min.js"></script>
<script>
$(document).ready(function () {
$('ol').sortable();
});
</script>
</head>
<body>
<ol>
<li>
<label for="name">Name</label>
<input type="text" id="name" />
</li>
<li>
<label for="class">Class</label>
<input type="text" id="class" />
</li>
</ol>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在拖动之前:

拖动期间:

拖动完成后,订单将恢复.之前已经注意到此错误,但未修复.有没有人找到治疗方法?
这是它的小提琴
Sub*_*Red 12
这是由placeholderjquery UI 引起的,当可排序的启动时,它会自动添加到列表中.实际上,您可以简单地在启动事件中隐藏占位符,也可以创建自己的显示无的类.
这个想法:
$(document).ready(function () {
$('ol').sortable({
start: function( event, ui ){
$(ui.item).parent().find('.ui-sortable-placeholder').hide();
},
});
});
Run Code Online (Sandbox Code Playgroud)
要么:
<script>
$(document).ready(function () {
$('ol').sortable({placeholder: "sortable-placeholder"});
});
</script>
<style>
.sortable-placeholder {display: none;}
</style>
Run Code Online (Sandbox Code Playgroud)
编辑:
您还可以将占位符显示实际设置为阻止,以便不将其视为列表子项:
.sortable-placeholder {
height: 20px;
display: block;
}
Run Code Online (Sandbox Code Playgroud)
这里修改了FIDDLE.
| 归档时间: |
|
| 查看次数: |
2552 次 |
| 最近记录: |