小编mta*_*art的帖子

Materialize.css模式未在动态创建的元素上正确初始化

我正在使用ajax调用使用jQuery动态地将行附加到表.我希望每行中生成的按钮显示一个模式,其中包含特定于该特定行中项目的数据.

我目前遇到以下问题:

- 当我点击第一个和第二个按钮时出现模态.但是,当我尝试关闭第二个模态时,模态中的框阴影不会消失,在刷新页面之前,我无法继续单击任何按钮.

我检查了Materialise.css文档,它提到我们需要用$(".modal-trigger")初始化模态.如果使用触发器来显示模态,则使用leanModal().我用来触发模态的ID在下面的代码中称为"营养事实".

任何帮助,将不胜感激.谢谢!!

更新:使用CodePen:http://codepen.io/mtaggart89/pen/pgbgOB

HTML:

<!-- Modal Structure -->
<div id="nutrition-facts" class="modal modal-fixed-footer">
  <div class="modal-content">
    <h4>Nutrition Facts</h4>
    <p>A bunch of text</p>
  </div>
  <div class="modal-footer">
    <a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Close</a>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

jQuery函数创建元素:

function buildTable(foodData) {
  var itemList = foodData.list.item;
  var foodGroup, foodName, newDiv, createButton, ndbNumber, createTable, tableHead, categoryHeading, nameHeading, tr;
  $("table").addClass("bordered");
  categoryHeading = $("<th>").html("Category");
  nameHeading = $("<th>").html("Name");
  $("thead").append(categoryHeading).append(nameHeading);       
  for (var i = 0; i < itemList.length; i++) {
    foodGroup = $("<td>").html(itemList[i].group);
    foodName = …
Run Code Online (Sandbox Code Playgroud)

html javascript css jquery materialize

2
推荐指数
1
解决办法
3086
查看次数

标签 统计

css ×1

html ×1

javascript ×1

jquery ×1

materialize ×1