开发者社区> 问答> 正文

innerHTML后加入的标签元素无法触发类库事件 ?

使用 innerHTML AJAX后添加新的标签元素,
含有使用jq.mobile或者 Bootstrap类库特定的的一些class或者ID产生不同的事件或者不同的样式,
而经常出现的情况是元素没有被渲染或者JS没有执行,没有绑定到事件,
我想问问有什么办法能解决吗?
jquery.mobile里面
有一个滑动的滚动条

html
<input  style="" type="range" name="choice" min="1" max="10" value="2"/>

会被类库识别然后被他的CSS渲染改变样式

但是如果是innerHTML在JS中后加入的,就渲染不到,没有其特别的样式

相似的还有其他类库也有这种情景,大多是CSS没渲染到或者JS本身类库对其绑定的事件没有触发。而自己写的并没有这个问题

展开
收起
小旋风柴进 2016-05-27 10:57:07 2965 0
1 条回答
写回答
取消 提交回答
  • 1.先说下事件绑定:可以了解一下比较新的jQuery版本中的的on方法,基本上可以取代之前习惯用的事件绑定的方法了。然后用下面这样的方法就可以给动态添加的dom绑定事件了,思路就是将新生成的元素类的事件委托给一开始就存在的父容器进行处理。假设动态插入的div类名是.child,他们的父容器id是#parent.

    $('#parent').on('click', '.child', function() {
        console.log('新旧插入的子元素的的点击事件都会冒泡到parent后进行处理,因此不需要插入后再重新绑定事件');
    })

    2.jq.mobile我没有亲身用过,不过这个问题应该和许多bootstrap插件一样的,只在页面加载时初始化一遍,后续界面发生变化时需要调用插件提供的reflesh的相关方法更新一下,一般比较完善的插件都会有这个方法。如果没有那这个插件基本上就太水了,直接换一个吧!

    2019-07-17 19:17:21
    赞同 展开评论 打赏
问答分类:
问答地址:
相关产品:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载