jQuery帮助.each函数

时间:2011-07-07 14:59:46

标签: javascript jquery

更新4:

这就是我现在所拥有的:

var $elements = $('.dropdown');
var $lastElement = $elements.last();

$elements.slice(0, -1).each(function() {
    $(this).css('left', $(this).prev.position().left);
});

var $prev = $lastElement.prev();
$lastElement.css('left', $prev.position().left - ($prev.outerWidth() - $lastElement.outerWidth()));

哪位给了我:

Uncaught TypeError: Object function (d,e){var f=c.map(this,b,d);Za.test(a)||(e=d);if(e&&typeof e==="string")f=c.filter(e,f);f=this.length>1?c.unique(f):f;if((this.length>1||ab.test(e))&&$a.test(a))f=f.reverse();return this.pushStack(f,a,bb.call(arguments).join(","))} has no method 'position'
$.ajax.success homepage.htm:138
c.b.extend.each jquery.min.js:33
c.b.fn.b.each jquery.min.js:26
$.ajax.success homepage.htm:137
c.extend.handleSuccess jquery.min.js:142
c.extend.ajax.L.w.onreadystatechange jquery.min.js:141

上面的脚本中没有位置方法。


更新3:

这就是我现在所拥有的:

var $ elements = $('。dropdown'); var $ lastElement = $ elements.last();

$ elements.slice(0,-1).each(function(){     $(this).css('left',$(this).prev.position()。left); });

var $ prev = $ lastElement.prev(); $ lastElement.css('left',$ prev.position()。left - ($ prev.outerWidth() - $ lastElement.outerWidth()));

它给了我一个function required错误。当我取出最后两行时,错误消失,但问题无法解决。


更新2:

这是HTML结构:

<div class="settings"><span id="spanSettings">Settings ▼</span></div>
<div class="dropdown">
    <a href="edit_profile.aspx"><div class="item"><div class="icon" style="background-image: url('http://intranet/img/profile_icon.png');"></div> Edit profile</div></a>
    <a href="manage_tabs.aspx"><div class="item"><div class="icon" style="background-image: url('http://intranet/img/tabs_icon.png');"></div> Tab settings</div></a>
</div>

更新1:

使用:$(this).css('left', $(this).prev().position().left);

我得到image 1

with:$(this).css('right', $(this).prev().position().right);

我得到image 2

我在image 3之后:

^图像3被拍照。


原始问题:

我有以下脚本更改任何具有类dropdown

的html元素的位置
$('.dropdown').each(function() {
    $(this).css('left', $(this).prev().position().left);
});

如何修改此内容,以便根据父级将所有dropdown更改为左侧,除了最后一位,right与父级右侧位置对齐?

如果无法做到这一点,我该如何独立改变他们的立场?而不是使用each函数?

2 个答案:

答案 0 :(得分:3)

你可以这样做:

var $elements = $('.dropdown'),
    $lastElement = $elements.last();

$elements.slice(0, -1).each(function() {
    $(this).css('left', $(this).prev().position().left);
});

$lastElement.css('right', $lastElement.prev().position().right);

更新:如图所示对齐它(我假设它是关于最后一个元素),您可以尝试:

var $prev = $lastElement.prev();
$lastElement.css('left', $prev.position().left - ($prev.outerWidth() - $lastElement.outerWidth()));

答案 1 :(得分:1)

你可以为此写一个快速插件:

$.fn.eachLast = function(fn, fnLast) {
  return this.slice(0, -1).each(fn).end().last().each(fnLast).end();
}

$('.dropdown').eachLast(
  function() { // will be executed for all elements in the collection except the last one
    var $this = $(this);
    $this.css('left', $this.parent().position().left);
  },
  function() { // will only be executed for the last element in the collection
    var $this = $(this);
    $this.css('right', $this.prev().position().right);
  }
);

或者,您可以这样做:

var $lastElement = $('.dropdown').slice(0, -1).each(function() {
  var $this = $(this);
  $this.css('left', $this.prev().position().left);
}).end().last();

$lastElement.css('right', $lastElement.parent().position().right);

// …or even…

var $lastElement = $('.dropdown').slice(0, -1).each(function() {
  var $this = $(this);
  $this.css($this.parent().position());
}).end().last();

$lastElement.css($lastElement.prev().position());