Bootstrap模态框modal使用注意（关闭modal有遮罩框（黑框）、调用.modal(‘show‘)第一次有效，第二次无效解决方法、以及解绑modal框绑定的方法）

使用前请先详细阅读官网使用文档

https://www.bootcss.com/

//modal官网介绍
https://v3.bootcss.com/javascript/#modals

如果有页面嵌套调用加载的，modal框建议放在进入 你的该操作程序界面下 只会加载一次的里面

注意：
如果有对modal里面手动在js中进行attr添加属性的，记得在打开modal时使用removeAttr删除，如果modal框在会相应刷新的页面则不需要太考虑，但注意还是有添就记得删

1.关闭modal有遮罩框（黑框）

正常使用关闭方法
$("#你的modal id").show('hide');
后面没有如何操作是不会导致modal关闭产生遮罩的（最好在后面别加其他操作或继续执行后面的流程，执行完这句话就该结束了）

产生这个问题是因为关闭modal后产生了后续操作，导致产生冲突（如：modal未完全关闭，后面的操作执行较快，然后又有刷新界面的操作，可能就会导致出现遮罩框）
解决方法：

如果想在关闭modal后进行操作，代码示例如下：

$("#你的modal id").show('hide')`;
$('#你的modal id').on('hidden.bs.modal', function (e) {
  	// do something...
	//解绑操作
	$('#你的modal id').off('hidden.bs.modal');
	//如果有return,放这
	//return;
})
//这里最好不干其他操作，尽量把操作放上面的方法里面,如有刷新界面操作也是放里面

这里面的hidden.bs.modal和hide.bs.modal，我更倾向于使用hidden.bs.modal，因为他是在动画都结束后才调用，避免不必要的问题，show的时候同理

一定在调用这几个方法后进行解绑，不然如果你在其他地方调用$("#你的modal id").show('hide');`是会导致你直接来执行这个modal关闭方法的，show的时候同理

2.调用.modal(‘show’)第一次有效，第二次无效解决方法

如果直接使用$("#你的modal id").show('show');`
最好在后面别加其他操作或继续执行后面的流程，执行完这句话就该结束了

因为直接在.modal(‘show’)下面有其他操作，导致的问题，可能有时候又能出来，有的时候又不行，比如：我一个逻辑先关该modal后判断是否需要再打开modal框操作，这就会导致很多冲突，但他并不报错。严格使用hidden.bs.modal和shown.bs.modal可以很有效避免

$("#你的modal id").show('show')`;
$('#你的modal id').on('shown.bs.modal', function (e) {
  	// do something...
	//解绑操作
	$('#你的modal id').off('shown.bs.modal');
	//如果有return,放这
	//return;
})
//这里最好不干其他操作，尽量把操作放上面的方法里面,如有刷新界面操作也是放里面

3.解绑modal框绑定的方法

$('#你的modal id').off('绑定的事件名称');

如 解绑关闭modal事件和打开modal事件方法示例：

$('#你的modal id').off('shown.bs.modal');
$('#你的modal id').off('hidden.bs.modal');