我正在使用jQuery UI sortables插件允许对某些列表项重新排序。在每个列表项中,我有几个单选按钮,可以启用或禁用该项目。
拖动项目时,两个单选按钮都会被取消选择,这似乎不应该发生。这是正确的行为吗?如果不正确,解决此问题的最佳方法是什么?
这是演示此问题的代码示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>jQuery Sortables Problem</title>
<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="jquery-ui.min.js" type="text/javascript"></script>
<style type="text/css">
.items
{
margin-top: 30px;
margin-left: 0px;
padding-left: 25px;
cursor: move;
}
.items li
{
padding: 10px;
font-size: 15px;
border: 1px solid #666;
background: #eee;
width: 400px;
margin-bottom: 15px;
float: left;
clear:both;
}
</style>
</head>
<body>
<ol id="itemlist" class="items">
<li id="1" class="item">
Item 1
<input name="status_1" type="radio" value="1" checked="checked" />enabled
<input name="status_1" type="radio" value="0" />disabled
</li>
<li id="2" class="item">
Item 2
<input name="status_2" type="radio" value="1" checked="checked" />enabled
<input name="status_2" type="radio" value="0" />disabled
</li>
<li id="3" class="item">
Item 3
<input name="status_3" type="radio" value="1" checked="checked" />enabled
<input name="status_3" type="radio" value="0" />disabled
</li>
<li id="4" class="item">
Item 4
<input name="status_4" type="radio" value="1" checked="checked" />enabled
<input name="status_4" type="radio" value="0" />disabled
</li>
</ol>
<script type="text/javascript">
$('#itemlist').sortable();
</script>
</body>
</html>
一旦用鼠标抓取列表项,两个单选按钮就会被取消选择。
如果这是一个错误,一种解决方法是在移动项目时自动选择“启用”单选按钮,因此我们将非常感谢任何有关如何实现此目的的建议。
更新:我已在 Windows XP x64 上的 FireFox 3、Internet Explorer 7、Opera 9.5 和 Safari 3.1.2 中对此进行了测试,并且所有这些版本中都会出现此问题。
最佳答案
它可能不完全是您正在寻找的,但正在改变
$('#itemlist').sortable();
至
$('#itemlist').sortable({placeholder: ".items li"});
保留单选按钮选择。
关于jquery - 使用 jQuery Sortables 拖动项目时单选按钮被取消选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/285074/