js实现网页点击按钮播放声音

jquery代码(IE兼容，火狐得装插件，Google Chrome 兼容，Opera没反应)

 代码如下 复制代码

$(function(){
    $('a.button').click(function(){ 
         $('embed').remove(); 
         $('body').append('<embed src="button.wav" autostart="true" hidden="true" loop="false">');
    });
});

方法二

 代码如下 复制代码

<div id="div1"></div>
<input type="button" value="立即" onclick="play_click(this,'http://www.xxx .cc/1.wav');">
<div id="div2"></div>
<script language="javascript">
function play_click(sef,url){
var div = document.getElementById('div1');
div.innerHTML = '<embed src="'+url+'" loop="0" autostart="true" hidden="true"></embed>';
var emb = document.getElementsByTagName('EMBED')[0];
if (emb) {
/* 这里可以写成一个判断 wav 文件是否已加载完毕，以下采用setTimeout模拟一下 */
div = document.getElementById('div2');
div.innerHTML = 'loading: '+emb.src;
sef.disabled = true;
setTimeout(function(){div.innerHTML='';},1000);
}
}
</script>
时间： 2024-11-05 14:52:16

js实现网页点击按钮播放声音的相关文章

使用JS代码实现点击按钮下载文件_javascript技巧

正文 有时候我们在网页上需要增加一个下载按钮,让用户能够点击后下载页面上的资料,那么怎样才能实现功能呢?这里有两种方法: 现在需要在页面上添加一个下载按钮,点击按钮下载文件. 题外话,这个下载图标是引用的 font-awesome 上面的.使用时,首先将 font-awesome 整个文件夹下载下来,利用bower或者是自己去官网上面下载都行. 将整个文件夹放在项目文件中之后,在页面上面引入css文件 <link href="libs/font-awesome-4.7.0/css/font

js代码实现点击按钮出现60秒倒计时_javascript技巧

比如,一些网站上的手机短信认证的功能,有类似实现点击按钮后,倒计时60秒才能再次点击发送的效果. 此例子用Javascript实现点击按钮后,倒计时60秒才能再次点击发送验证码的功能. 例子1:Javascript 实现 点击按钮 倒计时60秒方可再次点击发送的效果 <input type="button" id="btn" value="免费获取验证码" /> <script type="text/javascrip

基于JS+Canves实现点击按钮水波纹效果_javascript技巧

近来看到个不错的按钮点击效果,当点击时产生一次水波涟漪效果,挺好玩的,于是简单的实现了下(没考虑低版本浏览器兼容问题) 先看看效果吧,如下图(录制gif软件有点渣,看起来卡卡的...) 这种效果可以由元素内嵌套canves实现,也可以由css3实现. Canves实现 网上摘了一份canves实现的代码,略微去掉了些重复定义的样式并且给出js注释,代码如下 html代码 <a class="btn color-1 material-design" data-color="

网页点击按钮返回顶部代码

使用HTML的锚标记最简单了,但是唯一的缺点就是样式不怎么样,会显示这个锚标记. <a name="top" id="top"></a> 放置位置在<body>标签之后随便找个地方放都可以,只要靠近顶部即可. 页面底部放置: <a href="#top" target="_self">返回顶部</a> 使用Javascript Scroll函数返回顶部 使用Javas

js控制再次点击按钮之间的间隔时间可防止重复提交_javascript技巧

<script type="text/javascript" language="javascript"> var wait = 60; function change() { $o = $("#J_refresh_checkcode"); if(wait == 0) { $o.removeAttr("disabled"); $o.html("看不清?换一张"); wait = 60; } el

firefox-网页中点击按钮所执行的js如何获取？

问题描述 网页中点击按钮所执行的js如何获取? 按钮的点击动作我想关联到其他事件上(div的空白位置双击) 这个按钮就是Firefox 的RSS扩展 Bamboo的预览关闭按钮"X". 谢谢隔位.

JS实现点击按钮后框架内载入不同网页的方法

  本文实例讲述了JS实现点击按钮后框架内载入不同网页的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-trans

JS实现点击按钮后框架内载入不同网页的方法_javascript技巧

本文实例讲述了JS实现点击按钮后框架内载入不同网页的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"&g

JS实现点击按钮自动增加一个单元格的方法

 这篇文章主要介绍了JS实现点击按钮自动增加一个单元格的方法,实例分析了javascript操作表格单元格的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了JS实现点击按钮自动增加一个单元格的方法.分享给大家供大家参考.具体分析如下: 这是一个网页在线自助生成表格的特效代码. 核心功能代码是JS实现,点击网页中的添加按钮,网页中自动增加一个单元格   代码如下: <HTML> <HEAD> <TITLE>js动态生成表格</TITLE>