1.chrome-->console抛出如下错误:

Uncaught TypeError: Cannot read property 'nodeType' of null

错误原因:从stackoverflow上查了,这个bug可能是由于dom元素未加载完而先执行了jquery代码引起的。

错误分析:我这个实例为:点击某个表单标签时(如checkbox),widget重新进行了render()操作(将dom元素remove并重新绘制),而formit插件给form表单默认增加的监听事件还作用在已经被移除dom的元素上,所以执行formit事件的时候,target元素为null,报错抛出。出错的代码是jquery里追踪事件的捕获与冒泡的一段代码。参数为null时则报此错误。

解决的方法是:查走代码,去掉不合理的重绘,或将重绘过程放到listener都执行完成后进行。

2.chrome的audio元素默认样式修改

chrome的audio元素默认样式不是很美观,大多数时候下载按钮显得很多余。如果需要修改播放样式有如下两个解决方案:

1)隐藏默认的audio,自己重绘一个audio播放器,并用js与默认播放器关联控制。这样播放器样式完全自定义,可以满足任何对于美观的要求。

2)对默认audio的样式进行一些修改,让它达到需求。这样播放器的外观还是很局限,如果对样式要求不高可以这么做。

我们这里主要讨论第二种,首先设置属性:controls="controls",显示audio播放控件,显示出来以后,在这里我主要说两点:

1)如何隐藏下载按钮

在stackoverflow上查后,可以设置audio的属性

controlsList="nodownload"

2)如何隐藏音量按钮or播放进度条。

经过调试发现,可以通过设置audio标签的width,浏览器会自动进行audio的自适应。

在设置width为300的时候,显示效果:


在设置width为200的时候,显示效果:

在设置width为100的时候,显示效果:

在此基础上我们可以进行一定的掩盖与缩放实现我们想要的效果。举个例子:我们要播放进度条而不显示音量按钮,那么我们就可以采用audio的width为300,并将audio标签放到一个ovflow:hidden;width:210px;的外层div中。

Cannot read property 'nodeType' of null; audio元素默认样式下载按钮的更多相关文章

  1. rest.css解决不同浏览器元素默认样式不同的问题

    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, ...

  2. JavaScript Uncaught TypeError: Cannot read property 'value' of null

    用 JavaScript 操作 DOM 时出现如下错误: Uncaught TypeError: Cannot set property 'value' of null Uncaught TypeEr ...

  3. js错误Cannot set property 'action' of null

    Cannot set property 'action' of null [自己解决问题答案] 应该放到form里面 [网上答案]是页面无法加载完毕执行代码.可以把获取元素等一系列的操作放在 wind ...

  4. 【jQuery】jquery中 使用$('#parentUid').attr(parentUid);报错jquery-1.11.3.min.js:5 Uncaught TypeError: Cannot read property 'nodeType' of undefined

    jquery中 使用$('#parentUid').attr(parentUid);报错jquery-1.11.3.min.js:5 Uncaught TypeError: Cannot read p ...

  5. echarts js报错 Cannot read property 'getAttribute' of null

    本文将为您描述如何解决 eharts.js报错 Uncaught TypeError: Cannot read property 'getAttribute' of null 的问题 根据报错信息查找 ...

  6. 百度ueditor 实例化 Cannot set property 'innerHTML' of null 完美解决方案

    此时此刻,我正在用博客园推荐的TinyMCE编辑器写这个博客,突然想起最近在项目中使用百度ueditor编辑器中的一些经历.所以记录在此,与大家分享. 不得不说,百度ueditor是一款很好的在线编辑 ...

  7. org.hibernate.PropertyValueException: not-null property references a null or transient value:

    org.hibernate.PropertyValueException: not-null property references a null or transient value: com.bj ...

  8. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  9. Extjs4---Cannot read property 'addCls' of null

    用MVC做后台管理系统时遇到的问题,关于tab关闭后再打开不显示,或者报错 我在新的tabpanel中加入了一个grid,当我关闭再次打开就会报错Cannot read property 'addCl ...

随机推荐

  1. [Spark]Spark-streaming通过Receiver方式实时消费Kafka流程(Yarn-cluster)

    1.启动zookeeper 2.启动kafka服务(broker) [root@master kafka_2.11-0.10.2.1]# ./bin/kafka-server-start.sh con ...

  2. 和manacher有关的乱写

    当初学kmp hash的时候被教导manacher非常的鸡肋 今天因为一篇神奇的题解我忍不住颓废了两节课把它学了 思路,代码都比较好懂 虽然它不如各种自动机霸气,唯一的功能貌似就是$O(n)$求出所有 ...

  3. NOIP模拟测试36考试反思

    这次考试..炸裂,归根到底是心态问题,考试的时候T1秒正解,但是调了三个小时死活没调出来,最后弃了,T2极水,没时间打了,T3题看都没看,总而言之就是不行. 教练说的对,一时强不一定一直强,心态其实也 ...

  4. python之装饰器的两种写法

    上一篇文章介绍了 装饰器的概念.现在讲一下在程序中怎么来写装饰器.上代码: def X(fun): def Y(b): print(b) fun() return Y def test(): prin ...

  5. dp的林林总总(持续更新,dp骚气解法等等)

    写在前面: 本人dp较弱,所以总结了一些坑点,转化思路以供复习使用,勿喷,甚至一些不是dp的题(贪心等等)也会放在这. 每个点后面会有我自己的题解,如果没有链接,向下找第一个链接,可能会有多题. 1. ...

  6. python 类内部装饰器的实现 与 参数解构学习

    学习了函数的装饰器的写法,然后想到如果要在类中初始化或获取信息时能用装饰器做过滤和验证应该怎么写呢, 在网上查了下相关信息,感觉这样也是可以的,不知道会不会有什么问题class Ctj(): clas ...

  7. Pandas进阶笔记 (一) Groupby 重难点总结

    如果Pandas只是能把一些数据变成 dataframe 这样优美的格式,那么Pandas绝不会成为叱咤风云的数据分析中心组件.因为在数据分析过程中,描述数据是通过一些列的统计指标实现的,分析结果也需 ...

  8. RHEL7-Vsftpd匿名用户

    实现:匿名用户创建目录,可以上传.下载文件,但是不可删除文件,禁止本地用户登陆. Vsftpd.conf部分参数 第一步:虚拟机挂载镜像 略 第二步:执行挂载命令 略 第三步:编写yum仓库文件 略 ...

  9. 【R语言学习笔记】 Day1 CART 逻辑回归、分类树以及随机森林的应用及对比

    1. 目的:根据人口普查数据来预测收入(预测每个个体年收入是否超过$50,000) 2. 数据来源:1994年美国人口普查数据,数据中共含31978个观测值,每个观测值代表一个个体 3. 变量介绍: ...

  10. nyoj 324-猴子吃桃问题 (m[i] = (m[i-1] + 1) * 2)

    324-猴子吃桃问题 内存限制:64MB 时间限制:3000ms 特判: No 通过数:20 提交数:21 难度:0 题目描述: 有一堆桃子不知数目,猴子第一天吃掉一半,又多吃了一个,第二天照此方法, ...