如何从数组中获取第二个索引请求,以便从jQuery开始

How to get a second request to index from an array to start at the beginning with jQuery?

本文关键字:jQuery 开始 请求 第二个 数组 获取 索引      更新时间:2023-09-26

我有这个代码来识别两个不同的图像映射形状属性。我正在尝试(但没有成功)从数组的开头获取两个不同的形状来索引标题属性。

代码:

 window.slideDetails = [ 
        //Slide1    
        "C1BP7: user information",
        "FJAD7: user information",
        "FFAD7: user information",
        //Slide2
        "C0AE7: user information",
        "C7AZ7: user information",
        "FJAE7: user information",
        //Slide3
        "C1AW7: user information",
        "FJAP7: user information",
        "FFAD7: user information"
        ]; 
        $('area').each(function(index) {
            var shape=$(this).attr('shape');
              if (shape == 'rect') {
                    $(this).attr("title", window.slideDetails[index]);
              }
              else if (shape == 'poly') {
                    $(this).attr("title", window.slideDetails[index]);
              }
     });

它按顺序对它们进行索引,所以前三个"poly"属性得到数组中的前三个,然后接下来的三个"rect"属性获得4-6,依此类推;数组,我很确定我使用的索引不正确。

HTML

<img src="/images/testImage.jpg" width="1000" height="610" border="0" usemap="#Map1" />
<map name="Map1" id="Map1">
  <area shape="poly" coords="280,140,296,201,308,202,328,183,324,141,340,126,360,134,359,254,332,252,333,214,324,274,327,407,202,392,201,330,223,331,219,291,231,243,210,238,232,131,252,118" href="test1.htm" />
  <area shape="poly" coords="277,113,296,199,308,197,326,183,323,115,316,138,293,138" href="test2.htm" />
  <area shape="poly" coords="212,507,218,571,236,543,238,575,261,587,270,586,262,539,245,537,237,544,234,537,236,520,228,496,214,497" href="test3.htm" />
  <area shape="rect" coords="609,235,834,335" href="test1.htm" />
  <area shape="rect" coords="649,546,807,565" href="test2.htm" />
  <area shape="rect" coords="670,566,781,582" href="test3.htm" />
</map>

矩形和多边形是图像的不同部分,但每个形状的第一个都有相同的链接等。

问题是,您正在执行一个循环,该循环为每个区域分配索引,而不是为每个形状分配索引。

相反,你可以使用两个循环(这样索引就会在不同类型的形状上重置),并将形状属性作为选择器的一部分:

$('area[shape="rect"]')
    .each(function(index) {
        $(this).attr("title", window.slideDetails[index]);
    });
$('area[shape="poly"]')
    .each(function(index) {
        $(this).attr("title", window.slideDetails[index]);
    });

看看这把小提琴:http://jsfiddle.net/mKc6T/