jquery Gets the current element index value usage instance _jquery

The example in this article tells JQuery to get the current element index value usage. Share to everyone for your reference. Specifically as follows:

Today in the promotion page of the image rotation effect, the bottom page number of the left side of the corresponding display picture description information, the effect is as follows:

Ideas:

When the page section is in the current state, the active style is added.

By obtaining the index value of Li class= "active", the corresponding picture description information is found, which is displayed.

Solve:

The result can be easily achieved by using the index () of jquery.

The code is as follows:

Html:

<div id= "Carousel" > <div id= "carouselimg" > <div id= "Imgcontainer" > <a href= "#" mce_href= "#" ></a> <a href=" # "mce_href=" # "></a> <a href=" # "MC e_href= "#" ></a> <a href= "#" mce_href= "#" ></a> <a H 
 ref= "#" mce_href= "#" ></a> </div> </div> <div id= "Carouseltitle" > <div class= "Carouseltext" > <span> </span> <span> </span> <span> </span& 
   Gt <span> </span> <span> </span> </div> <ul> <li><span>1</span 
   ></li> <li><span>2</span></li> <li><span>3</span></li> <li><span>4</span></li> <li><span>5</span></li> </ul> ;/div> </Div>

 

JavaScript:

<script src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" mce_src= "http://  
Ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js "></SCRIPT> <script type=text/javascript> var carousedata = [{index:0,link: "http://www.dangdang.com", Imgsrc: "1.jpg", Text: "Thousands of famous mobile phone 60 percent"}, {index:1,link: "http: Www.baidu.com ", imgsrc:" 2.jpg ", Text:" Test text 2 "}, {index:2,link:" http://www.google.com ", Imgsrc:" 3.jpg ", Text:" Test text 3 "}, {index:3,link:" http://www.soso.com ", Imgsrc:" Xf.jpg ", Text:" Test text 4 "}, {index:4,link:" Http://www.jb51.net ", 
IMGSRC: "Py.jpg", Text: "Test text 5"}]; 
 $ (document). Ready (function () {$ ("#imgcontainer a"). each (function (i) {$ (this). attr ("href", carousedata[i].link); 
  $ (this). Children ("img"). attr ("src", carousedata[i].imgsrc); 
  }); 
  $ (". Carouseltext span"). each (the function (i) {$ (this). Text (Carousedata[i].text); 
 }) SetInterval (function () {var li_index = $ ("#carouseltitle ul li"). Index ("#carouseltitle ul li.active") [0]); $ (". CarouseltexT span "). Hide (); 
  $ (". Carouseltext span"). EQ (Li_index). Show (); 
},10); 
});

 </script>

Here, I use setinterval, not 10ms to find it once.

The code also has a place to optimize.

I hope this article will help you with your jquery programming.