单击动态创建的DOM

时间:2015-01-29 17:10:48

标签: javascript jquery twitter-bootstrap modal-dialog

我有用于模态窗口的HTML Bootstrap 3代码:

<!-- Modal DELETE-->
<div class="modal fade" id="delete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Brisanje</h4>
      </div>
      <div class="modal-body">
        Da li ste sigurni da zelite da obrisete ovu parcelu iz baze?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" id="brisi" class="btn btn-danger">Save changes</button>
      </div>
    </div>
  </div>
</div>

我尝试使用动态创建的代码打开此模式:

"targets": 8,
                        "data": "akcija",
                        "render": function(data, type, full, meta) {
                            // return data; 
                            return '<div style="float:right;"><button class="btn btn-warning">Izmeni</button> <button data-toggle="modal" data-target="#delete" class="btn btn-info">Izvestaj o parceli</button> <i data-toggle="modal" data-target="#delete" class="fa fa-times"></i></div>';
                        }

所以你可以看到我将这个:<i data-toggle="modal" data-target="#delete" class="fa fa-times"></i>添加到DOM中,但是当我点击时我无法打开模态......

这里的探究是什么?

1 个答案:

答案 0 :(得分:2)

看起来你正在尝试将html写入DOM,但你的问题还不清楚。

使用JQuery你会把div上的内容写到另一个容器中,这样就像在DOM中一样:

<div id="container"></div>

您可以使用jquery:

将内容写入容器
$("#container").html('<div style="float:right;"><button class="btn btn-warning">Izmeni</button> <button data-toggle="modal" data-target="#delete" class="btn btn-info">Izvestaj o parceli</button> <i data-toggle="modal" data-target="#delete" class="fa fa-times"></i></div>');