如何在jquery和PHP中将所有td数值更改为百分比值

时间:2014-06-27 04:55:29

标签: php jquery

我只想要一个类似于单击切换按钮的功能,数值应该按公式更改为百分比值。

<table class="table table-striped table-bordered scrollable">
<thead>
<tr class="success">
<th>Answer</th>
<th>Total</th>
<th>PCP</th>
<th>OB/GYN</th>
<th>PAIN</th>

</tr>
</thead>
<tbody><tr><td class="left-align">Male</td>
<td>123</td>
<td>72</td>
<td>18</td>
<td>33</td>
</tr><tr><td class="left-align">Female</td>
<td>78</td>
<td>48</td>
<td>22</td>
<td>8</td>
</tr><tr><td class="left-align">All Respondent</td>
         <td>201</td>
     <td>120</td>
         <td>40</td>
     <td>41</td>
    </tr></tbody>
</table>

我的公式201*value/100。任何人都可以告诉我如何做到这一点。用PHP和jquery.Any建议。

3 个答案:

答案 0 :(得分:1)

试试这个

$('table tr td').each(function () {
    var value = $(this).text();
    if ($.isNumeric(value)) {
        var final = 201 * value/ 100;
        $(this).text(final)
    }
});

DEMO

答案 1 :(得分:0)

是的,可以使用jQuery。您可以执行以下操作:(Sample)

<form method="POST">
    <button type="button" id="toggle" data-state="off">Toggle</button>
    <table class="table table-striped table-bordered scrollable" cellpadding="10">
    <thead><tr class="success"><th>Answer</th><th>Total</th><th>PCP</th><th>OB/GYN</th><th>PAIN</th></tr></thead>
    <tbody><tr><td class="left-align">Male</td><td>123</td><td>72</td><td>18</td><td>33</td></tr><tr><td class="left-align">Female</td><td>78</td><td>48</td><td>22</td><td>8</td></tr><tr><td class="left-align">All Respondent</td> <td>201</td> <td>120</td> <td>40</td> <td>41</td> </tr></tbody>
    </table>
</form>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    var original = $('tbody').html();
    $('#toggle').on('click', function(){
        if($('#toggle').attr('data-state') == 'off') {

            $('#toggle').attr('data-state', 'on').css({backgroundColor: 'green', color: 'white'});
            $('td').each(function(index, element){
                var current = $(this).text();
                if($.isNumeric(current)) {
                    $(this).text(201*current/100);
                }
            });

        } else {
            $('#toggle').attr('data-state', 'off').css({backgroundColor: 'red', color: 'white'});
            $('tbody').html(original);
        }
    });

});
</script>

这应该切换原始值和计算值

答案 2 :(得分:0)

您可以使用.text(fn)通过回调更新任何元素的文本:

$('.table').find('td').text(function(_, value) {
    return isNaN(+value) ? value : Math.round(201 * parseInt(value, 10) / 100) + '%';
});