zoukankan      html  css  js  c++  java
  • Jquery使用tbody编辑功能实现table输入计算功能

    实例:编写一个输入计算(被减数-减数=差)

    HTML:

     <body>
        <table>
            <thead>
                <tr>
                    <td >被减数</td>
                    <td>减数</td>
                    <td></td>
                </tr>
            </thead>
            <tbody id="tab1">
                <tr id="0">
                    <td><input type="text" value="40"/></td>
                    <td><input type="text" value=""/></td>
                    <td><input type="text" value=""/></td>
                </tr>
                <tr id="1">
                    <td><input type="text" value="50"/></td>
                    <td><input type="text" value=""/></td>
                    <td><input type="text" value=""/></td>
                </tr>
                <tr id="2">
                    <td><input type="text" value="60"/></td>
                    <td><input type="text" value=""/></td>
                    <td><input type="text" value=""/></td>
                </tr>
            </tbody>
        </table>
      </body>

    JavaScript:

    $(document).ready(function() {
        
            $("#tab1 tr").each(function(){
               var trs=[];
               var tr=$(this);
               $(tr).find("input").each(function(){
                  trs.push($(this));
               });
               $(trs[1]).bind("blur",function(){
                    trs[2].val(parseFloat(trs[0].val())-parseFloat(trs[1].val()));
               });
            });
            
        });

    效果图:

    注:表弟说不知道怎么实现,于是就有了此文。

  • 相关阅读:
    记账本开发第一天-补
    20200418-补
    20200411-补
    20200404-补
    20200328-补
    暴力解N皇后
    nN皇后递归
    Hanoi汉诺塔非递归栈解
    Hanoi汉诺塔递归
    JMMjmm模型
  • 原文地址:https://www.cnblogs.com/boonya/p/5723686.html
Copyright © 2011-2022 走看看