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 相关文章推荐
jQuery UI Autocomplete 体验分享
Feb 14 Javascript
js与C#进行时间戳转换
Nov 14 Javascript
使用AngularJS对路由进行安全性处理的方法
Jun 18 Javascript
学习JavaScript鼠标响应事件
Dec 25 Javascript
简述JavaScript提交表单的方式 (Using JavaScript Submit Form)
Mar 18 Javascript
Jquery和JS获取ul中li标签的实现方法
Jun 02 Javascript
使用react-router4.0实现重定向和404功能的方法
Aug 28 Javascript
node.js的exports、module.exports与ES6的export、export default深入详解
Oct 26 Javascript
vue 路由页面之间实现用手指进行滑动的方法
Feb 23 Javascript
详解vue-cli3 中跨域解决方案
Apr 10 Javascript
深入理解基于vue-cli的webpack打包优化实践及探索
Oct 14 Javascript
JavaScript setInterval()与setTimeout()计时器
Dec 27 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
php数组应用之比较两个时间的相减排序
2008/08/18 PHP
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
ThinkPHP Mobile使用方法简明教程
2014/06/18 PHP
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
php将数组转换成csv格式文件输出的方法
2015/03/14 PHP
php车辆违章查询数据示例
2016/10/14 PHP
使用Git实现Laravel项目的自动化部署
2019/11/24 PHP
使用Jquery打造最佳用户体验的登录页面的实现代码
2011/07/08 Javascript
jQuery取消特定的click事件
2016/02/29 Javascript
JavaScript学习笔记之数组的增、删、改、查
2016/03/23 Javascript
JS模拟的Map类实现方法
2016/06/17 Javascript
js判断checkbox是否选中个数的方法(超简单)
2016/08/19 Javascript
Vue-router路由判断页面未登录跳转到登录页面的实例
2017/10/26 Javascript
vue 组件中使用 transition 和 transition-group实现过渡动画
2019/07/09 Javascript
解决ele ui 表格表头太长问题的实现
2019/11/13 Javascript
mapboxgl实现带箭头轨迹线的代码
2021/01/04 Javascript
为python设置socket代理的方法
2015/01/14 Python
Python中的zipfile模块使用详解
2015/06/25 Python
Python闭包函数定义与用法分析
2018/07/20 Python
利用python和ffmpeg 批量将其他图片转换为.yuv格式的方法
2019/01/08 Python
python tkinter实现屏保程序
2019/07/30 Python
Python监听键盘和鼠标事件的示例代码
2020/11/18 Python
canvas简易绘图的实现(海绵宝宝篇)
2018/07/04 HTML / CSS
四个太阳教学反思
2014/02/01 职场文书
创新比赛获奖感言
2014/02/13 职场文书
语文高效课堂实施方案
2014/05/03 职场文书
大学生感恩父母演讲稿
2014/08/28 职场文书
司法局群众路线教育实践活动整改措施
2014/09/17 职场文书
事业单位考察材料范文
2014/12/25 职场文书
小时代观后感
2015/06/10 职场文书
嘉年华活动新闻稿
2015/07/17 职场文书
关于远足的感想
2015/08/10 职场文书
幼儿园班级管理心得体会
2016/01/07 职场文书
如何在CSS中绘制曲线图形及展示动画
2021/05/24 HTML / CSS
MySQL之PXC集群搭建的方法步骤
2021/05/25 MySQL
利用uni-app生成微信小程序的踩坑记录
2022/04/05 Javascript