2016-08-29 13 views
0

マテリアライズ・モーダルをトリガーする要素を取得するにはどうすればよいですか?マテリアライズド・モーダル・トリガー・エレメント

<a class="trigger-modal" href="#modal1" data-id="1">Item 1</a> 
<a class="trigger-modal" href="#modal1" data-id="2">Item 2</a> 
<a class="trigger-modal" href="#modal1" data-id="3">Item 3</a> 

<div id="modal1" class="modal modal-fixed-footer"> 
    <div class="modal-content"> 
    <h4>Edit Model</h4> 
    <form> ... </form> 
    </div> 
    <div class="modal-footer"> 
    <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat ">Close</a> 
    </div> 
</div> 

<script type="text/javascript"> 
$(function() { 
    $('.modal-trigger').leanModal({ 
    dismissible: false, 
    ready() { console.log('Ready', this, arguments); }, 
    complete() { console.log('Closed', this, arguments); } 
    }); 
}); 
</script> 

どのように私は、モーダルをトリガしたアンカー要素を取得することができます

は、このコードを考えると? readycompleteは両方とも、モーダルオプションにthisしか設定されておらず、argumentsは空です。

答えて

0

Materialize Modal docsから、何か他のものが準備完了コールバックまたは完全コールバックに渡されたようには見えませんが、最後にクリックされたアンカーを記録するコードを追加することで逃げることができます。

を追加することによって行うことができます:あなたのアンカーへ

onclick="window.lastAnchorClicked = this;" 

。最後にクリックされたアンカーにアクセスするには、window.lastAnchorClickedを使用します。

1

すべてのアンカーを取得するには、JavaScript getElementsByTagNameを使用してください。 getElementsByClassNameは、アンカーがクラスを共有する場合にも機能します。アンカーにhref="javascript:void(0)"を追加してください。

は、その後、あなたのクリックハンドラでは、ここで使用するにconsole.log(event.target)または(e.target)

var doc = document; 
var anchors = doc.getElementsByTagName('a'); 

if(anchors){ 
    for (var i = 0; i < providers.length; i++) { 
    anchors[i].addEventListener("click", function(event){ 
     console.log(event.target); 
     console.log(event.target.id); 
     console.log(event.target.className); 
     console.log(event.target.innerHTML); 
    }); 
    }   
} 
0

は私の方法である:

$('.modal').modal({ 
ready: function(modal, trigger) { // Callback for Modal open. Modal and trigger parameters available. 

    console.log(trigger.prevObject[0].id); 

    }, 
}); 

これはのIDを出力しますモーダルをトリガしたオブジェクトが表示されます。

私はこれを必要とする人なら誰でもこれが便利だと願っています。

関連する問題