jquery关于索引值问题

xy12

一个网页有多处轮播图的时候，我发现我的索引值有冲突，不知道该怎么改，求帮忙  ，第二部分的我是仿照第一部分修改的

[JavaScript] 纯文本查看 复制代码

var spanList = $(".ban_num_con span");
var aList = $(".tr_ban_img a");
var index = 0;

function tr(index) {
    spanList.removeClass();
    $(spanList[index]).addClass("on");
    aList.stop().fadeOut(300);
    $(aList[index]).stop().fadeIn(300);
}

spanList.click(function () {
    index = $(this).index();
    tr(index);
})

var time = setInterval(function () {
    index++;
    index = index >= aList.length ? 0 : index;
    tr(index);
}, 4000)

[JavaScript] 纯文本查看 复制代码

var yxLi = $(".stategy_tab ul li");
var yxStat = $(".stategy_con");
var yxindex = 0;

function yx(yxindex) {
    yxLi.removeClass();
    $(yxLi[yxindex]).addClass("on");
    yxStat.stop().fadeOut(0);
    $(yxStat[yxindex]).stop().fadeIn(300);
}

yxLi.mouseenter(function () {
    yxindex = $(this).index();
    yx(yxindex);
})

var time = setInterval(function () {
    yxindex++;
    yxindex = yxindex >= yxStat.length ? 0 : yxindex;
    yx(yxindex);
}, 4000)

ssh0221

建议1、  不要用全局变量。 这样会污染环境。 以后很难维护。

建议2、 用对象的思路解决 这样不会冲突 还便于维护。就是 new Swiper({ options [,param1, param2, param3] }) 这种

注：如果非要用面向过程的模式  把 index 索引封装起来即可..... 还有第一段 var time 第二段也是  var time ???  虽然index变量名换了

troybug

观点基本同楼上，使用面向对象的思路去解决，编写一个轮播图的构造函数，index等参数作为私有成员，
这样的好处是如果页面里有多个轮播图，就实例化多个构造函数
var s1 = new Slider(options) {}
var s2 = new Slider(opts) {}
每个实例里的index互相独立不会干扰对方
通过s1.index和s2.index设置index

soiie

jquery 获取目标元素索引：
1.对于并列元素，直接用：

[HTML] 纯文本查看 复制代码

html:
<ul>
  <li id="foo">foo</li>
  <li id="bar">bar</li>
  <li id="baz">baz</li>
</ul>
js:
$(selector).click(function () { 
  $(this).index() //简单并列元素
});

2.对于结构复杂的元素，这样用：

[HTML] 纯文本查看 复制代码

html:
<div class="top">
  <div class="mian">
    <p>123456</p>
    <button>ok</button>
  </div>
</div>
<div class="top">
  <div class="mian">
    <p>123456</p>
    <button>ok</button>
  </div>
</div>
js:
$('.top .mian button').click(function () { 
  $('.top .mian button').index(this);//有嵌套的元素
});

我之前做的笔记，希望能帮到你。

SwE

第3行和第19行是不是有冲突啊？举例，index为0时，对应的是length为1的情况。
是不是要改成下面这样？

[JavaScript] 纯文本查看 复制代码

index = index >= aList.length - 1 ? 0 : index;