使用后引用的Jquery每个循环

Posted

技术标签:

【中文标题】使用后引用的Jquery每个循环【英文标题】:Jquery each loop with after reference 【发布时间】:2013-05-06 19:56:35 【问题描述】:

我想画一条从 .class 元素到 class 元素的画布线。到目前为止,我可以通过 elements.first() 和 elements.first() 引用类中的开始和结束元素。

困难在于我想使用需要起点和终点的 quadraticCurveTo。结束点是 .class 中的下一个元素。

$('.myclass').chainlines();
$.fn.chainlines = function()
context.moveTo($(this).first().position().left+15,$(this).first().position().top+20);
$(this).each(function()
next = $(this).next();
context.quadraticCurveTo($(this).first().position().left+60,
$(this).position().top+25,$(next).position().left+15,$(next).position().top+15);
);
;

我有一个 jsfiddle 示例,我需要将其扩展为链式 .见LINK。

这对我不起作用。

【问题讨论】:

我看不出链接的小提琴与这段代码 sn-p 有什么关系。此外,该代码 sn-p 不是有效的 jQuery。 是什么让你认为在 jQuery 中有一个实际的 .id() 方法,你试过 .prop('id') @adeneo id 不是属性而是属性。 @adeneo 我很反对 Juhana,顺便说一句,'id' 应该始终保持默认值,所以没有理由在这里使用 .prop()。但是对于 'id',这是一个错误的争论,因为我们应该使用 DOM 元素的属性来代替 @roasted,所以你建议使用element.getAttribute('id') 而不是element.id?因为这就是$(..).attr('id')$(..).prop('id') 之间的区别。 propattr 都应该可以正常工作,但我会坚持使用 prop 以保持一致性。 【参考方案1】:

也许这就是你要找的东西:

divs.each(function()
   alert($(this).next().get(0).id);
)

【讨论】:

【参考方案2】:

小提琴似乎与你的问题无关......

我想你正在寻找这样的东西..

 divs.each(function(idx)
    alert(divs[idx].next().attr("id"));
 )

【讨论】:

为什么不使用 'this' 而不是 divs[idx] ? @roasted Accessing by index is much faster 虽然在这种情况下它可能并不明显。 @Juhana 您建议通过索引访问比使用引用对象“this”更快,这很有趣,我会对其进行测试以查看发生了什么。 @roasted 我认为这是因为您每次都需要创建一个新的 jQuery 对象 ($(this)) 而不是重新使用现有的。 @KevinB 这是一个不同的 jQuery 对象,但具有相同的 DOM 元素,实际上是相同的东西。 (编辑:啊,好吧,我明白你的意思了。)【参考方案3】:

我自己解决了问题

$.fn.chainlines = function()
    var divs = $(this);
    var count = $(this).length;
    for (var i = 0; i < count; i++) 
        if((i + 1) < count)
            context.moveTo($(divs[i]).position().left+15,$(divs[i]).position().top+20);
            context.quadraticCurveTo($(divs[i]).position().left+60,
                                 $(divs[i]).position().top+35,
                                 $(divs[i+1]).position().left+15,
                                 $(divs[i+1]).position().top+1);      
            context.stroke();
        
    
;

【讨论】:

以上是关于使用后引用的Jquery每个循环的主要内容,如果未能解决你的问题,请参考以下文章

Jquery 在每个循环的 for 循环中使用 $this

让table表头固定,tr超出指定条数后无缝上下循环滚动jquery效果代码

让table表头固定,tr超出指定条数后无缝上下循环滚动jquery效果代码

使用 jquery 中的每个循环的 Next 和 Prev 按钮功能

使用类循环遍历每个元素并附加其文本JQUERY

循环遍历每个 HTML 表列并使用 jQuery 获取数据