2011-08-18 29 views
7

mootoolsでイベント委譲を使用しています。私はクリックされた行番号を知りたい。私の解決策はこのjsfiddleに示されています:私が現在やっていることよりも良い方法がありますか?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); 
      }); 
    }); 

答えて

9

getChildrenによって返されたタイプ(Elements)は、Arrayのメソッド、including indexOfを含みます。 MooToolsはブラウザ用に存在しない場合、そのメソッドの実装を提供します。このことを念頭に置いて、あなたが書くことができます:

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

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

0

これはかなりハックですが、あなたは常にArray.prototypeを使用することができます's indexOf ...

Array.prototype.indexOf.call(list-o-children, elem-to-find) 
関連する問題