ボタンをクリックするとソート機能を作成したい

javascriptの高低を高低のソート機能に追加したいのは、既に設定したそれぞれのボタンをクリックすると発生します。関数はすべて私がソートに固執していると考えました。私は現在のコードの画像を提供しています。ボタンをクリックするとソート機能を作成したい

html

java

出典

2016-11-26 Braden Binegar

何をしようとしていますか？配列の配列がある場合は、[Array＃sort]（https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/sort）を参照してください。 – David

あなたが探しているものということですか？

<html> 
    <head> 
     <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 


    <script type="text/javascript"> 
    $(function(){ 

      var sort_by_name = function(a, b) { 
       var aJObj = $(a); 
       var bJObj = $(b); 

       return aJObj.find(".img_value")[0].value.localeCompare(bJObj.find(".img_value")[0].value); 
      } 
      $("#hightolow").click(function(){ 
       var list = $("#sort_group > div").get(); 
       list.sort(sort_by_name); 
       for (var i = 0; i < list.length; i++) { 
        list[i].parentNode.appendChild(list[i]); 
       } 
      }); 
      $("#lowtohigh").click(function(){ 
       var list = $("#sort_group > div").get(); 
       list.reverse(sort_by_name); 
       for (var i = 0; i < list.length; i++) { 
        list[i].parentNode.appendChild(list[i]); 
       } 
      }); 
    }) 

    </script> 
</head> 
<body> 
    <button id="hightolow">hightolow</button> 
    <button id="lowtohigh">lowtohigh</button> 
    <div id="sort_group" class="sort_group"> 
     <div><img class="1" alt="1"><input class="img_value" hidden value="1"/></div> 
     <div><img class="2" alt="2"><input class="img_value" hidden value="2"/></div> 
     <div><img class="4" alt="4"><input class="img_value" hidden value="4"/></div> 
     <div><img class="3" alt="3"><input class="img_value" hidden value="3"/></div> 
     <div><img class="5" alt="5"><input class="img_value" hidden value="5"/></div> 
     <div><img class="6" alt="6"><input class="img_value" hidden value="6"/></div> 
    </div> 
</body> 
</html>

出典

2016-11-26 03:56:53

はいどうもありがとうございました！それは有り難いです。 –

ボタンをクリックするとソート機能を作成したい

答えて

関連する問題