अपने वर्ग नाम

Question

के आधार पर तालिका पंक्तियों को क्रमबद्ध करें, मैं अपने वर्ग नामों के आधार पर तालिका पंक्तियों को पुनर्व्यवस्थित करना चाहता हूं।
नीचे मेरा HTML कोड है।

<table> 
<tr class="a4"><td>4</td></tr> 
<tr class="a6"><td>6</td></tr> 
<tr class="a1"><td>1</td></tr> 
<tr class="a2"><td>2</td></tr> 
<tr class="a5"><td>5</td></tr> 
<tr class="a3"><td>3</td></tr> 
</table> 

तो अब

, साथ वर्ग के नाम a1 पहले प्रदर्शित करना चाहिए, वैसे ही a2 दूसरा .. आदि ..

कृपया कोई मेरी मदद

Answer 1

मैं एफ आप बाहरी प्लगइन पर भरोसा नहीं करना चाहते हैं, तो आप match() का उपयोग कर कक्षा के नामों से संख्या निकाल सकते हैं और अंतर्निहित sort() विधि का उपयोग कर तत्वों को सॉर्ट कर सकते हैं।

वहाँ से, आप append() उपयोग कर सकते हैं तालिका पंक्तियों को पुन: व्यवस्थित करने के लिए (यह तो मेज से प्रत्येक पंक्ति को हटा देगा यह उचित स्थिति में फिर से जोड़):

$("table").append($("tr").get().sort(function(a, b) { 
    return parseInt($(a).attr("class").match(/\d+/), 10) 
     - parseInt($(b).attr("class").match(/\d+/), 10); 
})); 

आप this fiddle में परिणाम देख सकते हैं ।

Answer 2

आप this प्लगइन इस्तेमाल कर सकते हैं और की तरह कुछ करने के लिए:

jQuery.fn.sortElements = (function(){ 

    var sort = [].sort; 

    return function(comparator, getSortable) { 

     getSortable = getSortable || function(){return this;}; 

     var placements = this.map(function(){ 

      var sortElement = getSortable.call(this), 
       parentNode = sortElement.parentNode, 

       // Since the element itself will change position, we have 
       // to have some way of storing its original position in 
       // the DOM. The easiest way is to have a 'flag' node: 
       nextSibling = parentNode.insertBefore(
        document.createTextNode(''), 
        sortElement.nextSibling 
       ); 

      return function() { 

       if (parentNode === this) { 
        throw new Error(
         "You can't sort elements if any one is a descendant of another." 
        ); 
       } 

       // Insert before flag: 
       parentNode.insertBefore(this, nextSibling); 
       // Remove flag: 
       parentNode.removeChild(nextSibling); 

      }; 

     }); 

     return sort.call(this, comparator).each(function(i){ 
      placements[i].call(getSortable.call(this)); 
     }); 

    }; 

})(); 
// do the sorting 
$('tr').sortElements(function(a, b){ 
    return $(a).attr('class') > $(b).attr('class') ? 1 : -1; 
}); 

यहाँ बेला: http://jsfiddle.net/ZV5yc/1/