jQuery设置数字范围随机取号代码

来源:https://www.sucaihuo.com/js/2843.html 2017-08-26 01:04浏览(642) 收藏

一款jQuery设置数字范围随机取号代码,可以先设置起始值和结束值,然后点击“开始”按钮(音乐响起),数字会随机滚动,再按下暂停(音乐暂停)则随机选中一组数字,用了原生JS中的Math.random()方法,生成随机值后,再将值的排序随机打乱。
jQuery设置数字范围随机取号代码
分类:文字特效 > 文字滚动 难易:初级
查看演示 下载资源 下载积分: 20 积分

页面的head部分,需引入页面的样式文件,代码如下:

<link type="text/css" rel="stylesheet" href="css/style.css" />

页面的body部分,audio标签放置随机滚动时的音乐,section标签里设置好数值范围的输入框和控制按钮,代码如下:

<audio id="myMusic" loop src="img/mp3.mp3" type="audio/mpeg"></audio>
<section>
	<label>
		起始值:<input type="number" id="begin" value="1" min="2" max="10000" />
	</label>
	<label>
		结束值:<input type="number" id="end" value="10000" min="1" max="100000" />
	</label>
	
	<div class="showNum" id="showNum">Ready</div><br />
	
	<footer>
		<button id="resetBtn" class="reset">复 位</button>
		<button id="beginBtn" class="begin">开 始</button>
	</footer>
</section>

页面的底部,需引入jQuery库和必要的JS文件,代码如下:

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/main.js" charset="utf-8"></script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2