本文主要说明bootbox加载html片段后加载javascript以及在调用echarts图标过程中遇到的问题。
bootbox原生是不支持加载iframe的,因此需要加载html片段,在开发过程中会发现加载html片段之后是无法加载JavaScript的,在翻阅了bootbox的api文档之后发现可以监听bootbox shown.bs.modal事件具体实现方法如下:
bootbox.dialog({ title:title, message:message, className:'.message_modal',//此处主要用于区别html片段定义处与弹出层的dom区别 }).on('shown.bs.modal',function(){ //TODO 加载javascript //此处注意为了区别dom元素,在获取dom元素时需要加上className });在bootbox加载echarts时遇到问题是获取dom的问题,由于在加载html片段到bootbox中之后,dom元素不能仅通过
document.getElementById();获取
查阅了大神们的blog发现
$()[0]的方式与
document.getElementById();获取的结果是一致的,最终通过
var dom = $(".message_modal #charts")[0]; var myChart = echarts.init(dom);成功的在bootbox中加载了echarts
自2012年以来,一直在开发工作,擅长PHP和前端开发,一直以来也没有写blog的习惯,总在给自己找借口说是太忙,但是在开发过程中遇到的问题也没有随手记的习惯,导致很多相同的问题重复去查阅,前段时间让自己养成了写笔记的习惯,年底了,项目也都接近尾声了,就想着把开发过程中遇到的问题都写到blog
本文完全原创,转载请注明出处