jQuery随机数(原创)

所属分类:其他-杂项,独立的部件

 34588  329  查看评论 (15)
分享到微信朋友圈
X
jQuery随机数(原创) ie兼容6

无聊的时候可以用它和朋友进行互动

这是由玩家进行自主选择的小游戏,需玩家输入任意范围的整数,点击“开始”按钮,

计算机会产生玩家输入范围内的随机数;点击“停止”按钮,将显示数字最终结果

版权归午后的阳光所有,欢迎使用和反馈 dellshouji@163.com;

感兴趣的,可以查看制作源码;

涉及的知识点:

html,css,javaScript,jQury


相关插件-杂项,独立的部件

Jquery 二维码美化(高度定制)

Jquery 二维码生成插件,高度定制
  杂项
 59371  428

canvas画板实验

签名画板生成图片
  杂项
 34350  391

动态增加表格行

动态增加表格行
  杂项
 41265  401

淘宝商品动态生成SKU表格实例

淘宝商户端发布商品时动态生成SKU表格的实例
  杂项
 37736  343

讨论这个项目(15)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    ccc1 0
    2018/1/31 15:25:44

    求第二版本代码链接

    回复
    甄展 0
    2017/4/24 17:04:54

    随机数的三个值 有可能会一样

        午后的阳光0
        2017/5/17 13:16:36

        在2.0版本中,已修改

        午后的阳光0
        2017/5/17 14:04:06
        感谢您的指正,此问题已在2.0版本中得到解决。较1.0,2.0版本主要针对网友提出的问题,进行了优化与修改。新增知识点:函数式编程,JSON对象的使用及递归
    回复
    CIMI-Sherry 0
    2016/10/26 17:10:27
    有问题喔~如果范围输入太大了,那么出来的随机数范围就会更广,数字过长之后的结果就是第一个格子里面的数字出来了,遮住了第二个格子里面的数字,谷歌测出来的
        午后的阳光0
        2017/5/17 14:05:00

        感谢您的指正,此问题已在2.0版本中得到解决。较1.0,2.0版本主要针对网友提出的问题,进行了优化与修改。

        新增知识点:函数式编程,JSON对象的使用及递归
    回复
    午后的阳光 3
    2016/10/17 14:10:29

    目前陆续做了三次优化

    优化一:

    禁用按钮设置

    方式一:

    $(":button")[0].disabled=true; 
    $(":button")[1].disabled=false;

    方式二:

    $("#start").attr("disabled",true);
    $("#stop").attr("disabled",false);

    优化二:去除div与浏览器间的上边距去掉#bigDiv的css样式--

    margin: 0px auto;

    /*div网页居中*/,添加该css样式:

    *{ margin: 0px auto;}

    优化三:限制用户只能输入正整数,用到了正则表达式想省事的同学,直接将下面代码拷贝,替换掉源码的

    $("#start").click(function () {}

    函数就好了/*点击开始按钮,产生的事件*/

    $("#start").click(function() {
        range = prompt("请输入随机数范围:", "");
        if (/^[1-9]\d*$/.test(range)) {
            //将开始标签禁用,停止标签启用
            $("#start")[0].disabled = true;
            $("#stop")[0].disabled = false;
            myNumber = setInterval(showRandomNum, 1); //多长时间运行一次
        } else if (range != null) {
            alert("请输入正整数!");
        }
    });
    回复
    ki?mi 0
    2016/10/11 23:10:47
    大神,你太棒了,代码借我研究,刚入门,谢谢 回复
    ki?mi 0
    2016/10/11 22:10:48
    界面很干净,如果更绚丽点是不是更适合大型活动。
        午后的阳光1
        2016/10/17 14:10:45

        你可以根据你的需求进行改善和优化,我在此再做一点优化:优化内容:去除div与浏览器间的上边距去掉#bigDiv的css样式-- 

        margin: 0px auto;
        /* div网页居中*/

        ,添加该css样式:

        *{ margin: 0px auto;}

        即可。另外,我之前还有个想法就是,三个div的宽度能够随着输入数字的大小而进行变化,要是可以的话,你可以坐下尝试。记得分享给我哦!

    回复
    小洋 0
    2016/8/4 16:08:11
    NaN
        午后的阳光1
        2016/8/17 14:08:34
        Nan表示你所输入的内容是非数字,也就是说输入的内容只能是数字;你可以在代码里,设置输入框里的内容只能是数字
        午后的阳光1
        2016/10/17 14:10:54

        今天顺便把这个显示NaN问题给解决了,本来以为大家都能看懂的,优化二在下面,现在做优化三:优化内容:限制用户只能输入正整数,用到了正则表达式想省事的同学,直接将下面代码拷贝,替换掉源码的 

        $("#start").click(function () {}

        函数就好了

        /*点击开始按钮,产生的事件*/
        $("#start").click(function() {
            range = prompt("请输入随机数范围:", "");
            //限制用户输入的内容只能是正整数
            if (/^[1-9]\d*$/.test(range)) {
                 //将开始标签禁用,停止标签启用
                $("#start")[0].disabled = true;
                $("#stop")[0].disabled = false;
                myNumber = setInterval(showRandomNum, 1);
                //多长时间运行一次        
            } else if (range != null) {
                alert("请输入正整数!");
            }
        });
    回复
    z 0
    2016/6/13 10:06:43
    大神,这个是用什么工具写的?
        午后的阳光3
        2016/8/17 15:08:21

        用什么工具主要是看个人喜好,我常用的是Editplus和webstorm,dreamweaver应该也不错,主要用了setInterval()这个函数;另外借此机会,进行一下优化:

        $("#start")[0].disabled=true和$("#stop")[0].disabled=false;

        禁用按钮设置现在看起来很不爽,可以改成这样:

        方式一:

        $(":button")[0].disabled=true;$(":button")[1].disabled=false;

        方式二:

        “$("#start").attr("disabled",true);$("#stop").attr("disabled",false);
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复