1

I am trying to add functionality to an already built javascript slider. I am trying to add in images of the videos that people can click to bring them to the proper video in the slide. I am trying to accomplish this with jQuery. I would like to know how to get the attribute of the divs inside of div.navBulletsWrapper. My code at the moment seems to change all the divs to rel="0" instead of getting the rel value and setting the class accordingly. Thanks for any help.

HTML:

<div class="video-thumbnail">
    <a id="video-thumbnail1">
       <img src="/_images/VideoImages/btn_FreeConsultation.png" />
    </a>
</div>

This is being created dynamically by the slider javascript:

<div class="navBulletsWrapper">
    <div class="active" rel="0"> … </div>
    <div rel="1"> … </div>
    <div rel="2"> … </div>
    <div rel="3"> … </div>
</div>

jQuery:

$(document).ready(function(){

    $('#video-thumbnail1').click(function(){
        $('div.navBulletsWrapper div').attr("rel", "0").addClass("active");
    });

});

live website in case you want to see full code: http://www.hazeltonlawgroup.com

4

4 回答 4

1
$('div.navBulletsWrapper div').attr("rel", "0")

这会设置所有子 div 的属性rel="0" .

如果您希望以该 div.. 为目标,那么您的选择器应该在这些行中有所查看。

$('div.navBulletsWrapper').find("[rel='0']").addClass("active");
于 2013-09-05T20:45:48.707 回答
1

如果你想根据它的属性找到一个div,你必须用selector来做:

$('div.navBulletsWrapper div[rel="0"]').addClass('active') ;

如果要从其他 div 中删除类:

$('div.navBulletsWrapper div:not([rel="0"])').removeClass('active')
于 2013-09-05T20:46:42.887 回答
1

使用 attar 方法,您可以设置和获取属性。

el.attr('attribute',value')

设置属性。

el.attr('attribute')

获取属性值。

只需将您的代码更改为

$(document).ready(function(){

    $('#video-thumbnail1').click(function(){
        $('div.navBulletsWrapper div[rel='+index+']').addClass("active");
    });

});

其中index是您要添加“活动”类的元素

于 2013-09-05T20:47:40.983 回答
0

另一种方式

$('div.navBulletsWrapper div').filter("[rel=0]").addClass("active");

或者

$('div.navBulletsWrapper').find("div[rel=0]").addClass("active");
于 2013-09-05T20:52:34.587 回答