Mootools从父元素获取子元素索引

Mootools get the child-index of an element from its parent

本文关键字：元素 索引 获取 Mootools      更新时间：2023-09-26

我在mootools中使用事件委托。我想知道被点击的行号。我的解决方案如下图所示:是否有比我目前所做的更好的方法?

我的方法是比较元素，直到找到匹配。我可以使用IndexOf方法吗?

(以下是来自jsfiddle的用于将来的数据)

HTML: 

<div id="Record_List">
    <div class="Row">
        <input type="submit" name="Row" value="Edit"/>
    </div>
    <div class="Row">
        <input type="submit" name="Row" value="Edit"/>
    </div>
</div>
Javascript: 

window.addEvent(
    'domready',
    function()
    {
        $('Record_List').addEvent(
            'click:relay(input)',
            function(evt, target)
            {
                evt.stop();
                var rowElem = target.getParent();
                var rowNumber = -1;
                $('Record_List').getChildren('div.Row').each(
                    function (el, num)
                    {
                        if (rowElem === el)
                        {
                            rowNumber = num;
                        }
                    });
                // Find the position of the row and display it here:
                alert('Row number: ' + rowNumber);
            });
    });

getChildren返回的类型(Elements)包含Array个方法，包括indexOf。如果浏览器不存在该方法，MooTools将提供该方法的实现。考虑到这一点，您可以这样写:

$('Record_List').getChildren('div.Row').indexOf(rowElem);

更新示例: http://jsfiddle.net/andrewwhitaker/uJarB/

这是相当粗糙的，但你总是可以使用Array.prototype的indexOf…

Array.prototype.indexOf.call(list-o-children, elem-to-find)

MooTools Element.getAllPrevious返回当前元素之前的所有兄弟元素，前一个兄弟元素的长度等于当前元素的索引。

var index = rowElem.getAllPrevious('div.Row').length;
相关文章：