Question

我这里有一些计算机生成的文本，我需要用javascript排序。

我复制了html标记来编辑它并在javascript中创建一个排序函数。

我要做的是通过内部html文本对html对象数组进行排序。我无法找到如何获取他们的文本进行排序。我之后需要html对象将它附加到html。

我不知道如何进一步描述这一点，所以我只是在这里展示它 http://jsfiddle.net/4pmvE/64/

<div class="userDataRoleList" style="float:left;">
  <input id="PostedRoles_RoleIds44" name="PostedRoles.RoleIds" type="checkbox" value="1">
  <label for="PostedRoles_RoleIds44">SAP</label>
  <input id="PostedRoles_RoleIds45" name="PostedRoles.RoleIds" type="checkbox" value="2">
  <label for="PostedRoles_RoleIds45">Buffer</label>
  <input id="PostedRoles_RoleIds46" name="PostedRoles.RoleIds" type="checkbox" value="4">
  <label for="PostedRoles_RoleIds46">testing purposes</label>
  <input id="PostedRoles_RoleIds47" name="PostedRoles.RoleIds" type="checkbox" value="5">
  <label for="PostedRoles_RoleIds47">test</label>
</div> 

<div class="userDataRoleList" style="float:left;">

</div> 
<div style="clear:both;">

let checkboxlist = [];
let checkboxes = [];

<script>
window.onload = function(){
 $(document).ready(function () {
  checkboxes = $('.userDataRoleList input');
  labeltext = $('.userDataRoleList label');
  for(let i = 0; i < checkboxes.length; i++){
    checkboxlist.push(checkboxes[i], labeltext[i]);
  }
  checkboxlist = checkboxlist.sort(compare);
  console.log(checkboxlist);
  for(let i = 0; i < checkboxlist.length; i++){
    $('.userDataRoleList:first-child').append(checkboxlist[i]); 
  }
});
}
</script>

注意，元素必须与它们的复选框相对应，不允许对html进行编辑，因为它纯粹是由计算机生成的，我无法绕过它。

Answer 1

对集合中的标签进行排序，然后添加输入，并将它们追加回来

＆＃13;

$('.userDataRoleList label').sort(function(a,b) {
    return $(a).text().localeCompare($(b).text())
}).map(function() {
    return $(this).prev('input').addBack().add('<br>').get();
}).appendTo('.userDataRoleList:first');

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="userDataRoleList" style="float:left;">
    <input id="PostedRoles_RoleIds44" name="PostedRoles.RoleIds" type="checkbox" value="1">
    <label for="PostedRoles_RoleIds44">SAP</label>
    <input id="PostedRoles_RoleIds45" name="PostedRoles.RoleIds" type="checkbox" value="2">
    <label for="PostedRoles_RoleIds45">Buffer</label>
    <input id="PostedRoles_RoleIds46" name="PostedRoles.RoleIds" type="checkbox" value="4">
    <label for="PostedRoles_RoleIds46">testing purposes</label>
    <input id="PostedRoles_RoleIds47" name="PostedRoles.RoleIds" type="checkbox" value="5">
    <label for="PostedRoles_RoleIds47">test</label>
</div>

<div class="userDataRoleList" style="float:left;">

</div>
<div style="clear:both;">

＆＃13;

通过内部html文本对包含html对象的数组进行排序

1 个答案: