Question

我想将按钮的id传递给模态，但似乎无法通过，控制台没有显示任何错误，所以我不明白是什么问题。

我已经编辑了表单属性：

$('.showModal').on('click', function() {
  var id = $(this).data('id');
  $('#data').modal('show');
  $('#data').on('show.bs.modal', function() {
    $('.form #username').val(id);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" class="showModal" id="0379">
  <i class="fa fa-pencil-square-o" aria-hidden="true" data-toggle="tooltip" data-placement="top" title="Edit">
    </i>
</a>

modal

<div class="modal fade" id="data" tabindex="-1" role="dialog" aria- labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <form method="post" action="" id="modalForm" class="form">
        <div class="modal-body">
          <div class="card" style="width: 29.3rem;">
            <input type="file" name="file" accept="image/" />
            <img class="card-img-top" src="/../project/resources/assets/images/download.svg" alt="Card image cap">
            </input>
          </div>
          <div class="form-group">
            <label for="username">NIS</label>
            <input type="text" id="username" autocomplete="off" class="form-control" name="username" value="i_want_button_id_here">
          </div>
        </div>
      </form>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
        <button type="button" class="btn btn-primary" id="modalSubmit">Save</button>
      </div>
    </div>
  </div>
</div>

Answer 1

当您使用.data('id')表示您在data-id时尝试定位属性id时，可以使用 .prop() 相反，如：

var id = $(this).prop('id');

您可以尝试将以前的锚定位为：

$('#data').on('show.bs.modal', function() { var id = $(this).prev('a').prop('id'); $('.form #username').val(id); });

Answer 2

我认为那是因为你没有上课.form。您尝试使用此

设置值

$('.form #username').val(id);

您的意思是标记<form>吗？如果是，那应该是那样的

$('form #username').val(id);

此外，如果您想获得val，则应使用attr代替data

var id = $(this).attr('id');

Answer 3

这是因为id变量为undefined（尝试console.log(id)）。

要访问打开模式的链接上的id属性，请使用this.id：

var id = this.id;

或者使用jQuery .attr()：

var id = $(this).attr('id');

Bootstrap模式在show函数上没有传递值

3 个答案: