为了账号安全,请及时绑定邮箱和手机立即绑定

关闭时获取Bootstrap的模态初始数据-*

关闭时获取Bootstrap的模态初始数据-*

慕哥6287543 2021-04-02 13:15:14
当表示自举模式中,可以使用代码如很容易地检索相关联的数据$('#myModal').on('show.bs.modal', function (e) {   var id = $(e.relatedTarget).data('id');    alert(id);}关闭引导程序模式时是否可能相同?特别是当被特定按钮(即确认按钮,而不是两个取消按钮)关闭时?在relatedTarget似乎没有提供任何button的模式里面,也不在Shidden.bs.modal事件。在下面的操场data-id属性值中,当modal以类似方式data-id显示模式主体时,单击“是”时,应在删除按钮下方显示删除值:$(document).ready(function () {  $('#deleteModal').on('show.bs.modal', function (e) {      $('#testOutput,#testOutput2').text('');       var id = $(e.relatedTarget).data('id');     $('#deleteId').text(id || 'id retrieval failed');  });    $('#deleteModal').on('hidden.bs.modal', function (e) {      var id = $(e.relatedTarget).data('id'); //does not work      $('#testOutput2').text(id || '"hidden.bs.modal" id retrieval failed');  });      $('#confirmDeleteBtn').click(function (e) {    var id = $(e.relatedTarget).data('id');  //does not work    //var id = $(this).closest('.modal').data('id'); //doesnt work neither    $('#testOutput').text(id || '"btn.close .modal" id retrieval failed');  });});<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script><div class="col offset-3">  <div class="d-flex">    <button class="mt-4 btn btn-primary" data-toggle="modal" data-target="#deleteModal" data-id="42">delete record 1</button>    <button class="mt-4 btn btn-primary" data-toggle="modal" data-target="#deleteModal" data-id="123">delete record 2</button>  </div>  <h5 class="mt-4 text-danger" id="testOutput"></h5>  <h5 class="text-danger" id="testOutput2"></h5></div>请注意id,打开的button时间不是恒定的,即有许多deletebutton可以打开单个对话框。
查看完整描述

2 回答

  • 2 回答
  • 0 关注
  • 112 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信