获得排序顺序

所有textarea的内容我想获得排序顺序所有textarea的内容和其他文本区域中插入：获得排序顺序

选项1：$（ “DIV的textarea”）VAL（）;

选项2：$（“div textarea”）。text（）;

问题：

选项1：用新的输入VAL更新，但只能从DIV＃得到VAL 1

选项2：让所有的排序顺序，但VAL新的没有更新输入

代码：

$(function() { 
 

 
$("#sortable").sortable({ 
 
     out: function(event, ui) {change();} 
 
}); 
 

 

 
function change(){ 
 

 
     var content = ""; 
 

 
     $("#result textarea").empty(); 
 
     $("#sortable").sortable('toArray', {attribute: 'value'});   
 

 
     //content = $("div textarea").text(); // get all, but no update 
 
     //content = $("div textarea").val(); // get only val from #1 
 

 
     $("#result textarea").text(content); 
 

 
} 
 

 
});

<ul id="sortable"> 
 
    <div id="1" value="1"> 
 
     <textarea rows="4" cols="50">01---</textarea> 
 
    </div> 
 
    <div id="2" value="2"> 
 
     <textarea rows="4" cols="50">02---</textarea> 
 
    </div> 
 
    <div id="3" value="3"> 
 
     <textarea rows="4" cols="50">03---</textarea> 
 
    </div> 
 
    <div id="4" value="4"> 
 
     <textarea rows="4" cols="50">04---</textarea> 
 
    </div> 
 
</ul> 
 

 
    <div id="result" value="result"> 
 
     <textarea rows="4" cols="50"></textarea> 
 
    </div>

来源

2016-03-06 Gurigraphics

你可以在纯jQuery中 - https://jsfiddle.net/puz93284/ – Tasos

更全面的演示 - https://jsfiddle.net/7w9u1jcr/ – Tasos

谢谢Tasos。但这个例子不是可拖动的，并且被限制为4个元素。 – Gurigraphics

变化out到stop，所以当排序停止，这将使调用来更新列表中的变化会火，用content = $("div textarea").text();写的文字

$(function() { 
 
    $("#sortable").sortable({ 
 
    stop: function(event, ui) { 
 
     change(); 
 
    } 
 
    }); 
 

 
    $("#sortable textarea").on('change keyup paste', change); 
 

 
    function change() { 
 
    var content = ""; 
 

 
    $("#result textarea").empty(); 
 
    $("#sortable").sortable('toArray', { 
 
     attribute: 'value' 
 
    }); 
 

 
    $("div textarea").each(function() { 
 
     content += this.value; 
 
    }); 
 

 
    $("#result textarea").text(content); 
 
    } 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> 
 
<script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
 
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<ul id="sortable"> 
 
    <div id="1" value="1"> 
 
     <textarea rows="4" cols="50">01---</textarea> 
 
    </div> 
 
    <div id="2" value="2"> 
 
     <textarea rows="4" cols="50">02---</textarea> 
 
    </div> 
 
    <div id="3" value="3"> 
 
     <textarea rows="4" cols="50">03---</textarea> 
 
    </div> 
 
    <div id="4" value="4"> 
 
     <textarea rows="4" cols="50">04---</textarea> 
 
    </div> 
 
</ul> 
 

 
    <div id="result" value="result"> 
 
     <textarea rows="4" cols="50"></textarea> 
 
    </div> 
 
</body> 
 
</html>

来源

2016-03-06 15:20:40 user2950720

感谢您的提示。我测试了代码，但从div获取文本并且没有使用新的val输入进行更新。这是问题选项2。 – Gurigraphics

我已经更新了代码以包含这个，https://jsbin.com/xadapisoho/edit?html,js,console,output是你需要的吗？添加了用户输入的监听器 – user2950720

是的。而已。感谢user2950720。 – Gurigraphics

我发现，.text（）只有一次更新textarea，所以.val（）是要走的路。输入textarea并查看它不会更改html，但会更改val。

也许你没有正确地获取内容，所以使用console.log来测试它。也许你需要遍历每个textarea，并将val附加到你的内容var。

来源

2016-03-06 15:39:40 yezzz

是的。但如何获得秩序？确定div名称的内容。 – Gurigraphics

我看到它已经解决了，确实是通过循环。我仍然通过val设置结果。 – yezzz

是的。你是对的。 – Gurigraphics

获得排序顺序

回答

相关问题