jQuery随机切换图片的小例子


Posted in Javascript onApril 18, 2013
 <!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">
<head>
    <title></title>
    <style type="text/css">
    img
    {
       width:200px; height:200px;
        }
    </style>
    <script src="jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#btn1').click(function () {
                var num = Math.floor(Math.random() * 8 + 1);
             $('img').attr('src','picture/'+num+'.jpg')
            })
        })
    </script>
</head>
<body>
<img src="picture/1.jpg" id="img1" />
<input id="btn1" type="button" value="变换" />
</body>
</html>
Javascript 相关文章推荐
Javascript 变量作用域 两个可能会被忽略的小特性
Mar 23 Javascript
JSON 教程 json入门学习笔记
Sep 22 Javascript
jQuery 获取对象 根据属性、内容匹配, 还有表单元素匹配
May 31 Javascript
jquery实现弹出窗口效果的实例代码
Nov 28 Javascript
jQuery异步加载数据并添加事件示例
Aug 24 Javascript
jquery中键盘事件小结
Feb 24 Javascript
JavaScript实现三级联动效果
Jul 15 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
Oct 16 Javascript
AngularJS实现的select二级联动下拉菜单功能示例
Oct 25 Javascript
解决vue项目报错webpackJsonp is not defined问题
Mar 14 Javascript
react中fetch之cors跨域请求的实现方法
Mar 14 Javascript
vue 使用鼠标滚动加载数据的例子
Oct 31 Javascript
JS 各种网页尺寸判断实例方法
Apr 18 #Javascript
jQuery 获取URL的GET参数值的小例子
Apr 18 #Javascript
JS隐藏参数post传值实例
Apr 18 #Javascript
防止xss和sql注入:JS特殊字符过滤正则
Apr 18 #Javascript
JS打开新窗口的2种方式
Apr 18 #Javascript
Web Inspector:关于在 Sublime Text 中调试Js的介绍
Apr 18 #Javascript
JS操作图片(增,删,改) 例子
Apr 17 #Javascript
You might like
Yii2.0高级框架数据库增删改查的一些操作
2015/11/16 PHP
thinkPHP5框架导出Excel文件简单操作示例
2018/08/03 PHP
zShowBox 图片放大展示jquery版 兼容性
2011/09/24 Javascript
jquery实现的V字形显示效果代码
2015/10/27 Javascript
用JS动态改变表单form里的action值属性的两种方法
2016/05/25 Javascript
jQuery插件passwordStrength密码强度指标详解
2016/06/24 Javascript
Jquery实现跨域异步上传文件总结
2017/02/03 Javascript
解析Vue2 dist 目录下各个文件的区别
2017/11/22 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
vue的列表交错过渡实现代码示例
2019/05/05 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
2019/06/10 jQuery
小程序分页实践之编写可复用分页组件
2019/07/18 Javascript
vue实现两个组件之间数据共享和修改操作
2020/11/12 Javascript
[04:10]2018年度CS GO玩家最喜爱的主播-完美盛典
2018/12/16 DOTA
Python中unittest用法实例
2014/09/25 Python
python各种语言间时间的转化实现代码
2016/03/23 Python
Python实现的多项式拟合功能示例【基于matplotlib】
2018/05/15 Python
Python基于property实现类的特性操作示例
2018/06/15 Python
Python列表解析配合if else的方法
2018/06/23 Python
spark dataframe 将一列展开,把该列所有值都变成新列的方法
2019/01/29 Python
Python数据类型之Number数字操作实例详解
2019/05/08 Python
python中的单引号双引号区别知识点总结
2019/06/23 Python
Python ORM框架Peewee用法详解
2020/04/29 Python
python 通过pip freeze、dowload打离线包及自动安装的过程详解(适用于保密的离线环境
2020/12/14 Python
使用css3实现的tab选项卡代码分享
2014/12/09 HTML / CSS
英国时尚优质的女装:Hope Fashion
2018/08/14 全球购物
香港中原电器网上商店:Chung Yuen
2019/06/26 全球购物
个人简历自我评价范文
2014/02/04 职场文书
电子信息工程专业推荐信
2014/02/14 职场文书
2014红色之旅心得体会
2014/10/07 职场文书
红领巾广播站广播稿
2014/10/19 职场文书
2016高中社会实践心得体会范文
2016/01/14 职场文书
初三化学教学反思
2016/02/22 职场文书
党员公开承诺书2016
2016/03/24 职场文书
MySQL外键约束(FOREIGN KEY)案例讲解
2021/08/23 MySQL
MySQL 逻辑备份 into outfile
2022/05/15 MySQL