代码之家 › 专栏 › 技术社区 › Yosi

使用MooTools获取所有可见元素

css-selectors mootools javascript

Yosi · 技术社区 · 16 年前

$subMenus = $headMenu.find('li ul.sub_menu:visible');

我怎么能用mootools写这个呢?

编辑-

我实现了自己的功能:

  function findVisibleElements(elementsCollection){
    var returnArray = [];
    elementsCollection.each(function(el){
      if(el.getStyle('display') === 'block'){
        returnArray.push(el);
      }
    });

    return returnArray;
  }

我想要的是滑动所有可见的子菜单,这是我写的:

// Sliding up the visible sub menus 
if( visibleSubMenus.length > 0 ){
  visibleSubMenus.each(function(el){
      var slider = new Fx.Slide(el, {duration: 2000});
      slider.slideOut();
  });
}

为什么我的代码不起作用?我的功能正常,问题是特效幻灯片.
我添加了更多的工具特效幻灯片.

2 回复 | 直到 16 年前

Oskar Krawczyk 16 年前

只需扩展选择器功能-这是一个工具!

$extend(Selectors.Pseudo, {
    visible: function() {
        if (this.getStyle('visibility') != 'hidden' && this.isVisible() && this.isDisplayed()) {
            return this;
        }
    }
});

之后就照常做 $$('div:visible') 它将返回可见的元素。

http://www.jsfiddle.net/oskar/zwFeV/

sevenflow 16 年前

这个 $$() Mootools中的函数主要与JQuery中的函数等价 $()

// in MooTools
var elements = $$('.someSelector');

// natively in most newer browsers
elements = document.body.querySelectorAll('.someSelector');

但是,对于这种特殊情况,因为:visible不是真正的伪类,所以必须使用Mootools中的数组过滤器来近似它。

var isItemVisible = function (item) {
    return item.style.visibility != 'hidden' && item.style.display != 'none';
}
var elements = $$('ul').filter(isItemVisible);

您可能会考虑使用其他方法使项“不可见”,在这种情况下,您可以相应地将它们添加到筛选函数中。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前