Share a self-written table sorting js plug-in (efficient and concise)_javascript skills

For example: jQuery's table sorting plug-in (I didn't use it because I felt it was too troublesome to use or I didn't know its specific usage), the original js table sorting plug-in, etc. Finally, I compared it - I used an original js table sorting plug-in. plug-in, and made some modifications based on it. Although it was a bit reluctant or uncomfortable to use in some places, it finally achieved the functions needed at the time. Two days ago, I made some modifications to the original table - adding the function of changing colors between rows, and the problem appeared - the effect was confusing; after inspection and analysis, the problem lies in the table sorting plug-in code - the other The original code is difficult to understand. To modify it, it is better to write a new table sorting plug-in.

Write as you like. Table sorting is actually very simple: just take out the values ​​of all sorting columns and store them in an array (and the row objects corresponding to each column are also stored in an array), and then sort the values ​​of the columns. Sort an array (and sort an array of row objects). The table sorting plug-in code is posted below:

It is used as follows:

Copy code The code is as follows:

I have tried my best to write the comments in the code as clearly as possible. What needs to be added is:

1.js uses closures. I emphasize that the code should be as concise and easy to understand as possible.

2. IsLazyMode attribute setting, IsLazyMode=true, is applicable to the current table to be sorted, which is unchanged, that is, there will be no ajax operation of adding, deleting and changing rows, and you can see this after looking at the code Benefits: Traverse the corresponding row objects of the column to be sorted only once, and save the sorted row object array in the global object. The next time you sort, directly retrieve the corresponding row object array through tdIndex (the index of the sort column), and Reversing the array can achieve the sorting effect, which can improve code execution efficiency (performance) to a certain extent; IsLazyMode=false, which is suitable for situations where the table currently to be sorted will change, such as ajax operations such as adding, deleting, and changing rows. .

3. Consider that the amount of table data to be sorted is generally not large, and the array sorting uses the bubble sort algorithm.

4.OnShow: null //Method for displaying the sorted table, params: trIndex, trJqObj, tbodyObj - can be conveniently used to set the line wrapping style of the sorted table, etc., and also for performance optimization considerations.

Okay, finally, I attach the plug-in js and demo. The current implementation can only be said to meet the needs of my current project very well or is suitable for most scenarios. If so, have you considered it? or something bad, I hope that friends who pass by can feel free to leave comments so that everyone can communicate and learn from each other!

OrderTable.rar

Original address: cnblogs know