bootstrap模态框的使用
程序员文章站
2023-12-30 13:21:40
...
html代码:
<!--模态框-->
<div class="modal fade addFirstCategory">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" ><span >×</span></button>
<h4 class="modal-title">添加分类</h4>
</div>
<div class="modal-body">
<div class="form-group">
<input type="text" class="form-control" placeholder="请输入一级分类名称" name="firstCategoryName">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
<button type="button" class="btn btn-primary">保存</button>
</div>
</div>
</div>
</div>
js代码:
//模态框初始化
$('#addBtn').on('click', function () {
// show 或 hide
$('.addFirstCategory').modal('show')
})