Detailed explanation of how to implement alarm sound effects using JavaScript-JS Tutorial-php.cn

Detailed explanation of how to implement alarm sound effects using JavaScript

小云云

Release： 2018-01-20 10:37:54

Original

4651 people have browsed it

This article mainly shares with you a piece of code based on JavaScript to implement the alarm sound effect. It is very good and has reference value. Friends who need it can refer to it. I hope it can help everyone.

Prototype diagram:

Project requirements:

After the server receives the alarm, it will push the message to the front desk (through the front end The effect of real-time message prompts - websocket long polling), after receiving the message, the front desk needs to issue an alarm sound to remind the user.

Principle:

It’s very simple. You can use the

Code snippet:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<audio autoplay="autoplay" id="auto" src=""></audio>
<input type="button" value="点击播放" onclick="playSound(&#39;http://data.huiyi8.com/2017/gha/03/17/1702.mp3&#39;)">
</body>
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<script>
 $(function(){
 function playSound(src) {
 var auto = $("#auto");
 auto.attr("src",src);
 }
 })

</script>
</html>
</script>
</html>

Copy after login

Related recommendations:

WeChat alarm function definition and usage summary

WeChat development Alarm troubleshooting

WeChat alarm Zabbix implementation detailed explanation

The above is the detailed content of Detailed explanation of how to implement alarm sound effects using JavaScript. For more information, please follow other related articles on the PHP Chinese website!