模式主体中的文本未显示

时间:2018-06-21 16:20:03

标签: html twitter-bootstrap

我正在braking头,为什么我的模态正文中的文本“ 隐私政策文本”没有被调用?文本必须在模式主体中。此刻,身体还一片空白。我做了一个JSFIDDLE here。我在这里想念什么?

X:!*
$('#exampleModal').on('show.bs.modal', function(event) {
  var button = $(event.relatedTarget)
  var recipient = button.data('whatever')
  var modal = $(this)
  modal.find('.modal-title').text(' ' + recipient)
  modal.find('.modal-content').val(recipient)
})

1 个答案:

答案 0 :(得分:0)

您有多个模态内容。您还需要其他东西。

$('#exampleModal').on('show.bs.modal', function(event) {
  var button = $(event.relatedTarget)
  var recipient = button.data('whatever')
  var modal = $(this)
  modal.find('.modal-title').text(' ! ' + recipient)
  modal.find('#textbody').html(recipient)
})
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<div class="container-fluid">
  <div class="row">
    <div class="col-md-3">
      <div class="panel panel-primary">
        <div class="panel-heading">
          <h3 class="panel-title">GENERAL</h3>
        </div>
        <div class="panel-body">
          <a href="#" data-toggle="modal" data-target="#exampleModal" data-whatever="Privatpolitik">Privacy Policy</a><br/>
          <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
            <div class="modal-dialog" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                <span aria-hidden="true">&times;</span>
                                            </button>
                  <h4 class="modal-title" id="exampleModalLabel">Privacy Policy</h4>
                  <div id="textbody"></div>
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-primary" data-dismiss="modal">Luk</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>