根据文本框中重新排列的无序列表获取值
Get the values according to the rearranged unordered list in a textbox
我想根据无序列表中列表项的顺序排列文本字段中的值。列表如下:-
<ul id="sort">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
我在上面提到的列表中使用Jquery UI的sortable()
功能。我需要在文本框中复制相同的排列值:-
<input type="text" value="" />
例如-如果列表重新排列为3,2,5,4,1
,则文本框值应为3,2,5,4,1
:-
<input type="text" value="3,2,5,4,1" />
提前感谢!
例如:
$('#sort').sortable({
update: function(e, ui) {
var val = $(this).children().map(function() {
return $(this).text();
}).get().join();
$('#text').val(val);
}
});
http://jsfiddle.net/wzsuH/1/
使用sortable的停止事件来检查更改。。toArray
获取<li>
列表位置的数组。。。并将其与,
连接并附加到输入
给你。。
HTML
<ul id="sort">
<li id="1">1</li>
<li id="2">2</li>
<li id="3">3</li>
<li id="4">4</li>
<li id="5">5</li>
</ul>
jquery
$('#sort').sortable({
stop: function( event, ui ) {
var sortedVal=$(this).sortable( "toArray" );
var inputVal=sortedVal.join(',');
$('#inputid').val(inputVal);
}
});
工作小提琴这里
$( "#sort li" ).each(function(){
$("#idOfYourTextField").val( $("#idOfYourTextField").val()+ $(this).text() );
});
http://jsfiddle.net/yRRLJ/1/
相关文章:
- 如何删除多行HTML排列中的空白
- 重新排列HTML元素的顺序并更改内容
- 如何使用排列运算符来获取具有命名参数的函数的所有参数
- 从数组中删除重复条目,并在javascript中按顺序排列
- 使用CSS从下到上排列元素
- 如何用javascript从数组中填充无序列表
- 我可以't在Divs中获得3个twitter小部件,以便并排排列
- Javascript从数组中随机选择并按字母顺序排列
- 如何在php中按元素按字母顺序排列json文件
- 使用无序列表展开DIV
- Angular JS在无序列表中的2个数组中重复
- Javascript/jQuery:如何从数组的项中获取排列
- 如何在方向更改时重新调整/排列布局(Apache Cordova)
- 有没有比在本例中使用matchMedia更聪明的方法来重新排列页面元素
- 如何根据 js 中每个单词的第 n 个字母按字母顺序排列列表
- 响应式列表,可在浏览器缩小时重新排列
- Javascript将生日按数组顺序排列
- 重新排列 JavaScript 数组/对象
- 无序排列图像阵列而不重复
- 根据文本框中重新排列的无序列表获取值