学习HTML5(二) - jQuery 模态框学习

模型根据不同的按钮而变化

链接: https://v3.bootcss.com/javascript/#modals

主要学习内容是 (Varying modal content based on trigger button 基于窗口按钮改变窗口内容)

个人总结

Have a bunch of buttons that all trigger the same modal, just with slightly different contents? Use event.relatedTarget and HTML data-* attributes (possibly via jQuery) to vary the contents of the modal depending on which button was clicked. See the Modal Events docs for details on relatedTarget,

翻译：有许多按钮都触发同一个窗口，只是内容不一样？

使用event.relatedTarget属性和HTML data-* 属性使得窗口内容与具体按钮关联起来。

$('#exampleModal').on('show.bs.modal', function (event) {var button = $(event.relatedTarget) // 触发窗口的按钮var recipient = button.data('whatever') // 从data-*属性中提取信息// 如有必要, 你可以在这里初始化一个AJAX请求然后在回调中更新信息.// 更新窗口的内容. 我们在这使用jQuery, 但你可以用a data binding library或者other methods.var modal = $(this)modal.find('.modal-title').text('New message to ' + recipient)modal.find('.modal-body input').val(recipient)
})

其它具体问题参见原链接。

 

jQuery 选择器总结：jQuery选择器（总结的非常好）

 

jQuery操作select控件：jquery操作select(取值，设置选中） - Jaye118 - 博客园

 

好用的jQuery多选框插件

链接：jQuery multiselect