如何从json数组中排序值跟随ul,li

时间:2015-04-26 07:23:09

标签: jquery arrays json sorting

我有一个json字符串。如何从这个json中对属性值进行排序,请关注ul,li html?

ExecutorService es = Executors.newCachedThreadPool();
es.execute(new Runnable() {
    @Override
    public void run() {
        //Run Mail Here
    }
});
es.shutdown();
//This part is so that you know when the ES has finished so that you can persay say success.
try {
    boolean finshed = es.awaitTermination(1, TimeUnit.MINUTES);
} catch (InterruptedException e) {
    e.printStackTrace();
}

2 个答案:

答案 0 :(得分:0)

尝试以下

    <!DOCTYPE html>
<html>
<title>Stack jQuery</title>
<link rel="stylesheet" href="../repo/css/bootstrap.css" type="text/css" />
<script src="https://code.jquery.com/jquery-2.1.3.js"></script>
<script src="../repo/js/bootstrap.js"></script>
<script src="../repo/js/jquery.validate.js"></script>
<head></head>
<body>
<div class="showResult">
</div>

<script>
  var data = [{"id":1},{"id":2,"children":[{"id":3},{"id":4},{"id":5,"children":[{"id":6},{"id":7},{"id":8}]},{"id":9},{"id":10,"children":[{"id":11,"children":[{"id":12}]}]}]}]

    var htmlElem = '<ul>';
  $.each(data, function(key, value){
  htmlElem += '<li>'+value.id
  if(typeof(value.children) != "undefined" && typeof(value.children) == 'object'){
    htmlElem += '<ul>'+extractElements(value.children)+'</ul>'
  }
   htmlElem += '</li>';

    $('.showResult').html(htmlElem);
  });
    htmlElem += '</ul>';

    function extractElements(data){
            var childElem = '';
            $.each(data, function(ke, value){
                if(value.id != 'undefined') {
                    childElem += '<li>'+value.id
                        if(typeof(value.children) != 'undefined' && typeof(value.children) == 'object'){
                            childElem += '<ul>'+extractElements(value.children)+'</ul>';
                        }
                    childElem += '</li>';
                }

            });
            return childElem;
    }
  </script>
</body>
</html>

答案 1 :(得分:0)

以下是基于url-tree的解决方案:

var treeArray;
var out = "<ul>";

treeArray = [
{"display":"feedly","url":"http://feedly.com/index.html#latest","target":"jbi","titel":""},
{"display":"JBI","url":"","target":"","titel":"","children":[
{"display":"jbi-weisendorf","url":"http://www.jbi-weisendorf.de","target":"","titel":""},
{"display":"STRATO Communicator","url":"https://communicator.strato.com/ox6/ox.html","target":"","titel":""},
{"display":"essentialpim","url":"http://www.essentialpim.com/de/new-version-check","target":"","titel":""},
{"display":"Tools","url":"","target":"","titel":"","children":[
{"display":"quintly: Professional Social Media Analytics","url":"https://www.quintly.com/","target":"","titel":""},
{"display":"buzzsumo: find the most shared content for any topic or domain","url":"https://app.buzzsumo.com/top-content","target":"","titel":""}
]}
]}
]   

 treeArray.sort(dynamicSort("display"));
 genTree(treeArray);
 out += '</ul>';
       
 console.log('out => ' + out);
      
 document.getElementById("easy-tree-jbi").innerHTML = out;

 function dynamicSort(property) {
  var sortOrder = 1;
  if(property[0] === "-") {
   sortOrder = -1;
   property = property.substr(1);
  }
  return function (a,b) {
   var result = (a[property].toLowerCase() < b[property].toLowerCase()) ? -1 : (a[property].toLowerCase() > b[property].toLowerCase()) ? 1 : 0;
   return result * sortOrder;
  }
 }
   
 function genTree(arr) {
  var i;
  for (i = 0; i < arr.length; i++) {
   if (arr[i].url === "") 
   {
    if (arr[i].children) 
    {
     arr[i].children.sort(dynamicSort("display"));
     out += '<li>' + arr[i].display + '<ul>';
     genTree(arr[i].children);
     out += '</ul></li>';
    } 
   } else {
    out += '<li><a href="' + arr[i].url + '" target="' + arr[i].target + '" titel="' + arr[i].titel + '">' + arr[i].display + '</a></li>';
   }
  }
 }
<div id="easy-tree-jbi" class="easy-tree" style="overflow-y: auto;"> </div>