jQuery可拖动的可排序输入元素

时间:2011-03-30 00:47:07

标签: javascript html jquery-ui jquery-ui-sortable jquery-ui-draggable

我使用jQuery UI库来拖动和排序元素:http://jqueryui.com/demos/sortable 这工作正常,但我不能拖动输入元素,如textarea。这些textarea是禁用的,所以不需要能够写入它们。 我google了一下,注意到我不是唯一有这个问题的人。有一些半解决方案,但它们似乎都过时了。 (jQuery迅速发展)。

2 个答案:

答案 0 :(得分:0)

这应该有效:

HTML:

<div class="sortable-wrapper">
<ul id="sortable-list">
<div class="ui-state-default">
<textarea></textarea>
</div>
</ul>
</div>

jQuery的:

$( "#sortable-list" ).sortable();
$( "#sortable-list" ).disableSelection();

答案 1 :(得分:0)

如果我能够帮助你,你必须为我提供一些代码。

(注意:如果你试图在抓住textarea的同时拖动项目,你应该实现一些开关来打开/关闭选择。我建议你采用不同的方法,你可以通过点击内部来编辑textarea。对于排序我会用手柄抓住。)

jQuery sortable适用于包含<ul>的{​​{1}}和<ol>列表。像这样的问题通常是由不正确的HTML引起的。

<li>

的jQuery

<ul class="my-items">
<li><textarea></textarea></li>
<li><textarea></textarea></li>
<li><textarea></textarea></li>
<li><textarea></textarea></li>
</ul>

如果要在列表项中禁用文本选择,请在所有文本元素上执行此操作。不是textarea。在p,span,div中换行文本,仅对这些元素调用disableSelection()。

在对脚本进行故障排除之前验证html也是一种很好的做法。我更喜欢http://validator.w3.org/服务。