Question

我最近开始在我的项目中使用materialize.css，这很棒。但是，在我最新的网站上，我尝试使用ajax收集的数据创建动态模态。

模态生成正确但出现奇怪的故障。生成模态后，它应该自动打开，但只有在你单击三次触发器后它才会打开，它会生成三个模态（你可以测试它here）。

以下是代码：

$(".champion-card").click(function() {
    var champion = $(this).find(".card-title").html();
    var champion_id = champion_id = champion.replace(/ /g,"-").replace('.', "")+'Modal';
    $.ajax({
        type: 'POST',
        url: 'getdata.php',
        data: { scripts: champion },
        success: function(data) {
            $("body").append('<div id="'+champion_id+'" class="modal"><div class="modal-content"><h4>Scripts - '+champion+'</h4><div class="row"><ul class="list">'+data+'</ul></div></div></div>');
        }
    });
    $('#'+champion_id).modal('open');
    $('#'+champion_id).modal({
        complete: function() { 
            $(this).remove();
        }
    });
});

'getdata.php'仅回显包含已发布数据的文本。

http://materializecss.com/modals.html表示打开模态是由代码完成的：

$('#modal1').modal('open');

如果我没记错，在它之前是.leanModal（），但我不认为这是一个原因。令人沮丧的是，它在3次点击后打开，生成3个具有相同ID的模态。

我找不到什么是错的，但我可能社区可以提供帮助。没有收到任何错误。

谢谢！

Materialize.css动态模态+ Ajax小故障

0 个答案: