音频视频播放(jquery中将jquery方法转化成js方法)
在jQuery中没有音频视频直接播放的方法,我们在写音频视频时,应该将jquery的方法转化为js方法:play();pause()
补充:
将jq对象转化成js对象写法:
var music=$("#music")[0];//将jq转化为js对象;
将js对象转化成jq对象:
这个对象已经存在,则只需要在此对象上加上$(),也即是$(对象)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.1.0.min.js"></script>
<script>
$(function(){
$("#play").on("click",function(){
var music=$("#music")[0];//将jq转化为js对象
if ($(this).html()=="暂停"){//如果加入的为暂停。 music.pause();同时显示为 $(this).html("播放")
music.pause();
$(this).html("播放") }else {//否则music.play();同时显示为 $(this).html("暂停")
music.play();
$(this).html("暂停")
}
} )
})
</script>
</head>
<body>
<div id="play">暂停</div>
<audio src="music/m2.mp3" autoplay id="music"></audio>
</body>
</html>
音频视频播放(jquery中将jquery方法转化成js方法)的更多相关文章
- 三种动态加载js的jquery实例代码另附去除js方法
!-- 这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getscript("test.js&quo ...
- HTML DOM对象的属性和方法介绍(原生JS方法)
HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口), ...
- js方法传入对象;js方法传入方法;js方法回调 callback
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery获取浏览器类型和版本号的方法
$(document).ready(function(){ varbrow=$.browser; varbInfo=""; if(brow.msie){bInfo="Mi ...
- C# 解析js方法,并调用js方法
本文转载:http://www.cnblogs.com/StudyLife/archive/2013/03/11/2953516.html 本文不是基于B/S的 后台调用前台js方法,而是给你一段js ...
- JS调用App方法及App调用JS方法
做App内嵌H5项目时,经常会遇到js与App的交互,最普遍的就是方法的互相调用,那么如何实现方法的互相调用呢? 写在前面: 如果只是小项目且后期扩大的可能性不大的时候,可以忽略,可如果是长期项目的话 ...
- C#中??和?分别是什么意思? 在ASP.NET开发中一些单词的标准缩写 C#SESSION丢失问题的解决办法 在C#中INTERFACE与ABSTRACT CLASS的区别 SQL命令语句小技巧 JQUERY判断CHECKBOX是否选中三种方法 JS中!=、==、!==、===的用法和区别 在对象比较中,对象相等和对象一致分别指的是什么?
C#中??和?分别是什么意思? 在C#中??和?分别是什么意思? 1. 可空类型修饰符(?):引用类型可以使用空引用表示一个不存在的值,而值类型通常不能表示为空.例如:string str=null; ...
- 2018-08-26 jQuery与javaScript的区别及核心方法
1.jq对象就是js new Object 生成的普通对象. 2.jq对象与js对象,他们的方法不能共用! 3.jq对象与js对象的相互转化: js对象转jq对象 -> $(js_obj);// ...
- jQuery 的选择器常用的元素查找方法
jQuery 的选择器常用的元素查找方法 基本选择器: $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myE ...
随机推荐
- 待实践三:MVC3下 路由的测试 使用 RouteDebug.dll 来测试判断路由是否符合
在需要进行测试路由是否匹配的项目中引用 RouteDebug.dll 并且在MVC的Global.asax里面加入一段代码 //下面这行代码一定是在 RegisterRoutes(Rou ...
- 开发ffmpeg/live555常见问题错误及解决方法
#include <iostream>using namespace std;extern "C" {#include <libavcodec/avcodec.h ...
- jQuery避免$符和其他JS库冲突的方法对比
1.如果jquery库在第三方库之后引用.这个时候jquery库会占用$. 解决办法:剔除$符号的使用权. <script type="text/javascript" sr ...
- 【转】Android Studio系列教程一--下载与安装
原文网址:http://stormzhang.com/devtools/2014/11/25/android-studio-tutorial1/ 背景 相信大家对Android Studio已经不陌生 ...
- Mysql线程池优化笔记
Mysql线程池优化我是总结了一个站长的3篇文章了,这里我整理到一起来本文章就分为三个优化段了,下面一起来看看. Mysql线程池系列一(Thread pool FAQ) 首先介绍什么是mys ...
- ajax-Ajax试题
ylbtech-doc:ajax-Ajax试题 Ajax 1.A,Ajax试题返回顶部 001.{Ajax题目}使用Ajax可带来便捷有()(选择3项) A)减轻服务器的负担 B) ...
- 《C++ primer》--第11章
习题11.1 algorithm头文件定义了一个count的函数,其功能类似于find.这个函数使用一对迭代器和一个值做参数,返回这个值出现次数的统计结果.编写程序读取一系列int型数据,并将它们存储 ...
- Web自动化框架之五一套完整demo的点点滴滴(excel功能案例参数化+业务功能分层设计+mysql数据存储封装+截图+日志+测试报告+对接缺陷管理系统+自动编译部署环境+自动验证false、error案例)
标题很大,想说的很多,不知道从那开始~~直接步入正题吧 个人也是由于公司的人员的现状和项目的特殊情况,今年年中后开始折腾web自动化这块:整这个原因很简单,就是想能让自己偷点懒.也让减轻一点同事的苦力 ...
- qt 获取天气的接口
博客来源:http://blog.csdn.net/lzqwebsoft/article/details/7054045 网站api接口:http://smart.weather.com.cn/wzf ...
- 为cocos2d-x项目增加Lua支持
开始为游戏增加Lua脚本支持,今天主要配置了一下开发环境:cocos2d-x 2.2.1,xcode5. 1. 创建cocos2d-x-lua项目 类似于创建C++项目,用以下命令即可: python ...