Question

如何获取触发Materialize Modal的元素？

鉴于此代码：

<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>

如何获取触发模态的锚元素？ ready和complete都只有this设置为模态选项，arguments为空。

Answer 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);
    });
  }        
}

Answer 2

从Materialise Modal文档中，似乎没有其他内容传递到就绪或完整回调中，但是您可以通过添加代码来记录最后点击的锚点。

可以通过添加：

来完成

 onclick="window.lastAnchorClicked = this;"

到您的主播。然后使用window.lastAnchorClicked访问最后点击的锚点。

Answer 3

这是我的方法：

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

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

  },
});

这将打印触发模式显示的对象的id。

我希望有需要的人觉得这很有用！

实现获取模态触发元素

3 个答案: