程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程解疑 >> js-幫我看看 那不對 !!!!!

js-幫我看看 那不對 !!!!!

編輯:編程解疑
幫我看看 那不對 !!!!!

圖片說明

年齡段 後面跟男或者女 二級聯動

js

之前不需要 男 女 是一個大神幫我寫的代碼 代碼裡我注釋 是我後加進去的

但是沒加對 求看看

還有就是  結果 精確的倆位的話 在哪加toFixed 我加上不是 0.00 就是  00.0 
 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script>
    var food = {
        谷物: {
            //大米數組中依次存儲 熱量,蛋白質,脂肪,碳水化合物,膽固醇。。。其他食品同理

            //生成數據一定要生成和你表頭列數一樣的數字數組
            大米: [1, 2, 3, 4, 5], 小麥: [2, 3, 4, 5, 6], 玉米: [3, 4, 5, 6, 7]/*..更加多谷物*/
        },
        蔬菜: {
            大白菜: [2, 3, 4, 5, 6], 菠菜: [3, 4, 5, 6, 7]/*...更多蔬菜*/
        }
        //....更加多食物種類
    };
    //歲數數組中的營養和上面列出的一致
    var age = {
        請選擇:{
            請選擇:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]
            },
        '1-7歲': {
            "女":[1, 2, 3, 4, 5],
            "男":[1, 2, 3, 4, 5]  
            } ,
};
</script>
食品:<select id="food1"></select><select id="food2"></select><input type="button" value="添加" onclick="addFood()" /><br />
年齡段:<select id="age"></select> <select id="sex"></select><br />
<table border="1">
    <tr><td>食物名稱</td><td>熱量</td><td>蛋白質</td><td>脂肪</td><td>碳水化合物</td><td>膽固醇</td><td>操作</td></tr>
    <tr id="trSum"><td>合計</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tr id="trAge"><td>人體正常值</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tr id="trDiff"><td>差距值</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tbody id="tbFood"></tbody>
</table>
<script>
    var sFood1 = $('#food1'), sFood2 = $('#food2'), sAge = $('#age'),sage1 = $('#sex')
         //去掉第一個名列和最後一個操作列
        , tdSums =  $('#trSum td:gt(0)')
        , tdAges = $('#trAge td:gt(0)')
        , tdDiffs = $('#trDiff td:gt(0)')
        //////
        , tbFood = $('#tbFood') 
    //初始化食品一級分類及事件
    for (attr in food) sFood1.append('<option value="' + attr + '">' + attr + '</option>');
    sFood1.change(function () {
        var arr = food[this.value];
        sFood2.html('');
        for (attr in arr) sFood2.append('<option value="' + attr + '">' + attr + '</option>');
    }).trigger('change');//觸發一級分類加載2級分類
    //初始化年齡段
    for (attr in age) sAge.append('<option value="' + attr + '">' + attr + '</option>');
    sAge.change(function () {
        var arr = age[this.value];
        //sAge1.html('');
        //for (attr in arr) sAge1.append('<option value="' + attr + '">' + attr + '</option>');
        tdAges.each(function (index) { this.innerHTML = arr[index]; });

        updateSumDiff();
    }).trigger('change');//觸發onchange更新trAge中的td數值

    function updateSumDiff() {//更新合計和差距
        var sum = [];//每營養小計
        tbFood.find('tr').each(function () {
            $('td:gt(0)', this).not(':last').each(function (index) {
                sum[index] = (parseFloat(this.innerHTML) || 0) + (sum[index] || 0);
            });
        });
        //更新合計和差距
        tdAges.each(function (index) {
            tdSums.eq(index).html((parseFloat(this.innerHTML) || 0) + (sum[index] || 0));
            tdDiffs.eq(index).html((parseFloat(this.innerHTML) || 0) - (sum[index] || 0));
        });
    }
    function addFood() {
        var arr = food[sFood1.val()][sFood2.val()];
        var s = '<tr><td>' + sFood2.val() + '</td>';
        for (var i = 0; i < arr.length; i++) s += '<td>' + arr[i] + '</td>';
        s += '<td><input type="button" value="刪除" onclick="removeFood(this)"/></td></tr>';
        tbFood.append(s);
        updateSumDiff();
    }
    function removeFood(o) { $(o).closest('tr').remove(); updateSumDiff(); }
</script>

最佳回答:


你改我代碼都改錯了,要去掉最後一個td,自己看下數據結構,你的變量sex名稱我也改成sSex了,

 <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<script>
    var food = {
        谷物: {
            //大米數組中依次存儲 熱量,蛋白質,脂肪,碳水化合物,膽固醇。。。其他食品同理

            //生成數據一定要生成和你表頭列數一樣的數字數組
            大米: [1, 2, 3, 4, 5], 小麥: [2, 3, 4, 5, 6], 玉米: [3, 4, 5, 6, 7]/*..更加多谷物*/
        },
        蔬菜: {
            大白菜: [2, 3, 4, 5, 6], 菠菜: [3, 4, 5, 6, 7]/*...更多蔬菜*/
        }
        //....更加多食物種類
    };
    //歲數數組中的營養和上面列出的一致
    var age = {
        請選擇:  [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
        '1-7歲': {
            "女": [1, 2, 3, 4, 5],
            "男": [3, 4, 5, 6, 7]
        },
    };
</script>
食品:<select id="food1"></select><select id="food2"></select><input type="button" value="添加" onclick="addFood()" /><br />
年齡段:<select id="age"></select> <select id="sex"><option value="男">男</option><option value="女">女</option></select><br />
<table border="1">
    <tr><td>食物名稱</td><td>熱量</td><td>蛋白質</td><td>脂肪</td><td>碳水化合物</td><td>膽固醇</td><td>操作</td></tr>
    <tr id="trSum"><td>合計</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tr id="trAge"><td>人體正常值</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tr id="trDiff"><td>差距值</td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
    <tbody id="tbFood"></tbody>
</table>
<script>
    var sFood1 = $('#food1'), sFood2 = $('#food2'), sAge = $('#age'), sSex = $('#sex')
         //去掉第一個名列和最後一個操作列
        , tdSums = $('#trSum td:gt(0)').not(':last')
        , tdAges = $('#trAge td:gt(0)').not(':last')
        , tdDiffs = $('#trDiff td:gt(0)').not(':last')
        //////
        , tbFood = $('#tbFood')
    //初始化食品一級分類及事件
    for (attr in food) sFood1.append('<option value="' + attr + '">' + attr + '</option>');
    sFood1.change(function () {
        var arr = food[this.value];
        sFood2.html('');
        for (attr in arr) sFood2.append('<option value="' + attr + '">' + attr + '</option>');
    }).trigger('change');//觸發一級分類加載2級分類
    //初始化年齡段
    for (attr in age) sAge.append('<option value="' + attr + '">' + attr + '</option>');
    sAge.add('#sex').change(function () {///////
        var arr = sAge.val() == '請選擇' ? age['請選擇'] : age[sAge.val()][sSex.val()];
        //sAge1.html('');
        //for (attr in arr) sAge1.append('<option value="' + attr + '">' + attr + '</option>');
        tdAges.each(function (index) { this.innerHTML = arr[index]; });

        updateSumDiff();
    }).eq(0).trigger('change');//觸發onchange更新trAge中的td數值

    function updateSumDiff() {//更新合計和差距
        var sum = [];//每營養小計
        tbFood.find('tr').each(function () {
            $('td:gt(0)', this).not(':last').each(function (index) {
                sum[index] = (parseFloat(this.innerHTML) || 0) + (sum[index] || 0);
            });
        });
        //更新合計和差距
        tdAges.each(function (index) {
            tdSums.eq(index).html((parseFloat(this.innerHTML) || 0) + (sum[index] || 0));
            tdDiffs.eq(index).html((parseFloat(this.innerHTML) || 0) - (sum[index] || 0));
        });
    }
    function addFood() {
        var arr = food[sFood1.val()][sFood2.val()];
        var s = '<tr><td>' + sFood2.val() + '</td>';
        for (var i = 0; i < arr.length; i++) s += '<td>' + arr[i] + '</td>';
        s += '<td><input type="button" value="刪除" onclick="removeFood(this)"/></td></tr>';
        tbFood.append(s);
        updateSumDiff();
    }
    function removeFood(o) { $(o).closest('tr').remove(); updateSumDiff(); }
</script>
qq_15290009
qq_15290009
showbo
qq_15290009
qq_15290009
showbo
showbo
qq_15290009
qq_15290009
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved