<!DOCTYPE html>

<html lang="zh">

    <head>

        <meta charset="utf-8"/>

        <title></title>

        <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>

        <script type="text/javascript">

            $(function() {

                var $input = $('input'),

                    $button = $('button'),

                    $label = $('label');

                $button.click(function() {

                    var content = $.trim($input.val());

                    if (content) {

                        var arr = [], diff = 3 - (content.length % 3 - 1);

                        for (var i = 0; i < content.length - 1; i++) {

                            arr.push(content.charAt(i));

                            if (!((i + diff) % 3)) {

                                arr.push(',');

                            }

                        }

                        arr.push(content.charAt(content.length - 1));

                        $label.html(arr.join(''));

                    }

                });

            });

        </script>

    </head>

    <body>

        <input type="text" value=""/>

        <button>转换</button>

        <label></label>

    </body>

</html>

[jQuery编程挑战]008 生成逗号分隔数字的更多相关文章

  1. [jQuery编程挑战]006 生成一个倒计时效果

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  2. 【WorkTile赞助】jQuery编程挑战#009：生成两个div元素互相追逐的动画

    HTML页面: <!-- HTML代码片段中请勿添加<body>标签 //--> <div id="container"> <div id ...

  3. [jQuery编程挑战]003 克隆一个页面元素及其相关事件

    挑战: a) 绑定一个点击方法到这个div,点击后此元素会淡出消失 b) 同时克隆一个新的div元素到页面,元素内容是前面div文字内容反向书写(即,sgatbg olleh),同样也具有上面的点击事 ...

  4. [jQuery编程挑战]001：实现页面元素加速动画效果

    要求: 页面包含两个HTML元素:一个按钮,一个小方块 动画要求:点击按钮,小方块从页面坐标300,300,加速移动到0,0 相关知识点: jQuery动画方法animate easing参数的设置 ...

  5. [jQuery编程挑战]007 切换数据表格的行列

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  6. [jQuery编程挑战]005 使用最短的代码生成元素的闪烁效果

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  7. [jQuery编程挑战]004 针对选择框词典式排序

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  8. [jQuery编程挑战]002：实现一个转盘大抽奖

    body { background-color: #F2F2F2; text-align: center; } .container { position: relative; width: 500p ...

  9. C#编程总结（十一）数字证书

    C#编程总结(十一)数字证书 之前已经通过文章介绍了数字证书的基础知识,包括加密和数字签名. 具体可见: 1.C#编程总结(七)数据加密——附源码 2.C#编程总结(八)数字签名 这里来讲述数字证书的 ...

随机推荐

  1. BFS+状态压缩 hdu-1885-Key Task

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=1885 题目意思: 给一个矩阵,给一个起点多个终点,有些点有墙不能通过,有些点的位置有门,需要拿到相应 ...

  2. 397. Integer Replacement

    先正统做法. public class Solution { public int integerReplacement(int n) { if(n == 1) return 0; int res = ...

  3. js 日期插件 datepicker

    点击图片出现  时间 ,增加一个点击事件 <label for="" class="width80">创建日:</label> < ...

  4. PAT 1074. Reversing Linked List (25)

    Given a constant K and a singly linked list L, you are supposed to reverse the links of every K elem ...

  5. Deploy maven on Linux OS

    1.首先到Maven官网下载安装文件,目前最新版本为3.0.3,下载文件为apache-maven-3.0.3-bin.tar.gz,下载可以使用wget命令: 2.进入下载文件夹,找到下载的文件,运 ...

  6. XMind十大最有用的功能

    XMind十大最有用的功能 XMind是一款顶级商业品质的思维导图软件和头脑风暴软件,在企业和教育领域都有很广泛的应用,XMind功能全面,易上手,在此小编给大家整理出了XMind十大最有用的功能以供 ...

  7. oracle本月、上月、去年同月第一天最后一天

    select trunc(sysdate, 'month') 本月第一天,        trunc(last_day(sysdate)) 本月最后一天,        trunc(add_month ...

  8. Java中的守护线程 & 非守护线程（简介）

    Java中的守护线程 & 非守护线程 守护线程 (Daemon Thread) 非守护线程,又称用户线程(User Thread) 用个比较通俗的比如,任何一个守护线程都是整个JVM中所有非守 ...

  9. oracle5

    oracle中事务处理 什么是事务 事务用于保证数据的一致性,它由一组相关的dml语句组成,该组的dml(数据操作语言:增删改,没有查询)语句要么全部成功,要么全部失败. 如:网上转账就是典型的要用事 ...

  10. JavaScript与html5写的贪吃蛇完整代码

    JavaScript与html5写的贪吃蛇完整代码 查看运行效果可访问http://www.codesocang.com/texiao/youxitexiao/2014/0402/7045.html# ...