Jquery's index method achieves the tab Effect

Tab on the left and details on the right.

Principle:

Click the list item on the left to display the nth content in the [index n] of the selected list item.

(First, you need to load the list and content to the page at a time, and only the first content is displayed, so that the switchover is more friendly .)

How to obtain the index of the selected list item in the list:

One method in jquery is index ([subject]).

$ ("# Ul li"). index ($ ("# selected "));

This means that you first set the list range (# ul li list) and then return the $ ("# selected") element index in the list.

$ ("# Detail") is used after obtaining the index "). hide (); $ ("# detail "). eq (n ). show (); to display details of the same index. (The same is true for Option List style switching)

Only five rows are used.