我有一个容器,里面有几个锚标签。这些锚标签具有相同的类名。现在我想获得所有带有类名的锚标签,让我们说在容器内的clickMe。并仅为他们应用插件。
这是我所拥有的
<div class="container">
<a href="#" class="button" rel="btn1">Task box 1</a><br />
<a href="#" class="button" rel="btn2">Task box 2</a><br />
<a href="#" class="button" rel="btn3">Task box 3</a><br />
<a href="#" class="button" rel="btn4">Task box 4</a><br />
</div>
修改
这是我的插件代码
(function() {
$.fn.tasks = function(userOptions){
this.each(function() {
var opts = $.extend({
'speed' : 200
}, userOptions);
var ael = $(this).find('a.button');
var container = $(this); //'.' + opts.container;
var speed = opts.speed;
//alert(container);
var backdrop = $('<div></div>').addClass('backdrop');
var box = $('<div></div>').addClass('box');
$(ael).click(function() {
//alert(speed);
var rel = $(this).attr(rel);
alert("rel");
$(box).html(rel);
$(container).append(backdrop, box);
$(backdrop).animate({'opacity' : '.50'}, speed, 'linear');
$(box).animate({'right' : '0'}, speed, 'linear');
$(backdrop,box).css('display', 'block');
});
$(backdrop).click(function() {
closeBox();
});
function closeBox() {
$(box).animate({'right' : '-500'}, speed, 'linear', function() {
$(backdrop).animate({'opacity' : '.0'}, speed, 'linear', function() {
$(backdrop,box).css('display', 'none');
});
});
}
});
}
}(jQuery))
答案 0 :(得分:2)
假设我已正确理解你的问题,就像这样简单:
$(".container a.clickMe").yourPlugin();
.container
- 查找类“容器”的元素
a.clickMe
- 查找.container
个a
元素的后代,其中包含“clickMe”类
你应该通过阅读jQuery documentation开始(正如你的问题评论中提到的那样),因为这几乎是基本的。
修改(见评论)
在您的插件中,this
很可能会引用匹配元素集。因此,您可以使用this
迭代each
,并使用find
获取后代a
元素:
this.each(function() {
var aElems = $(this).find("a.clickMe");
});
答案 1 :(得分:0)
要仅选择容器内带有“clickMe”类的锚点,请使用:$("div.container a.clickMe")