jQuery“每个"方法 [英] jQuery "each" method

查看:84
本文介绍了jQuery“每个"方法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是一名JavaScript初学者,在使用jQuery的"each"方法时遇到了一些麻烦.我在Joomla网站上有一个图库模块,该模块用作简单的图像滑块.我添加了一些代码,以允许在链接的图像上放置灯箱.我现在想做的是将缩略图标题(该模块当前添加的缩略图)复制到链接中的标题"属性中,以便它显示在每个图像的灯箱中.

I'm a javascript beginner, and I'm having some trouble using jQuery's "each" method. I have a gallery module on a Joomla site that functions as a simple image slider. I added some code to allow a lightbox on the linked images. What I would like to do now is copy the thumbnail caption (that the module currently adds) to the Title attribute in the link so it shows up in the lightbox for each image.

这是HTML的结构方式...

Here's how the HTML is structured...

<div class="camera_wrap" id="camera_wrap_106">
<div class="cameraContents">
    <div class="cameraContent">
        <a class="camera_link" href="lightbox-large.jpg" title="This is where i need the caption"></a>
        <div class="camera_caption">
            <div>This is the caption</div>
        </div>
    </div>
    <div class="cameraContent">
        <a class="camera_link" href="lightbox-large.jpg" title="This is where i need the caption"></a>
        <div class="camera_caption">
            <div>This is the caption</div>
        </div>
    </div>
    <div class="cameraContent">
        <a class="camera_link" href="lightbox-large.jpg" title="This is where i need the caption"></a>
        <div class="camera_caption">
            <div>This is the caption</div>
        </div>
    </div>
</div>

到目前为止,我已经获得了代码,但是它仅将第一个标题div复制到每个title属性,而不是在每个实例上执行.不确定这是否是最好的开始...

I've gotten the code this far, but it only copies the first caption div to each title attribute rather than executing it on each instance. Not sure if this is even the best start...

$("#camera_wrap_106 .cameraContent").each(function() {
    $("#camera_wrap_106 a.camera_link").attr('title', $("#camera_wrap_106 .camera_caption div").html());
});

提前谢谢!

推荐答案

您可以使用 attr( )

$("#camera_wrap_106 .cameraContent a.camera_link").attr('title',function(){
    return $.trim($(this).next().text());
});

http://jsfiddle.net/nSj8h/

或者,如果您想使用每个语句,只需在选择器中设置上下文

Or if you wanted to use your each statement just set the context in your selectors

$("#camera_wrap_106 .cameraContent").each(function() {
    $("a.camera_link",this).attr('title', $(".camera_caption div",this).text());
});

在选择器中添加上下文与使用find相同

Adding the context in your selector is the same thing as using find

$('element',context) == $(context).find('element')

http://jsfiddle.net/baLmn/

这篇关于jQuery“每个"方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆