How does Jquery implement numerical addition and change the corresponding numerical style according to the remainder (code)-JS Tutorial-php.cn

How does Jquery implement numerical addition and change the corresponding numerical style according to the remainder (code)

不言

Release： 2018-08-16 11:48:11

Original

1469 people have browsed it

The content of this article is about how Jquery implements numerical addition and changes the corresponding numerical style (code) according to the remainder. It has certain reference value. Friends in need can refer to it. I hope It will help you.

Jquery content

<script type="text/javascript">
$(function () {
var num = 0;
$(".box ol li:eq(0)").click(function () {
$(":text").each(function () {
num += parseFloat($(this).val());
});
alert(num);
});
$(".box ol li:eq(1)").click(function () {
var num = 0;                
$(":text").each(function () {
num += parseFloat($(this).val());
if (parseInt($(this).val()) == parseInt(num % 9)
{                        
$(this).css("background", "red");                    
}                
});
});
});    
</script>

Copy after login

html content

<body style="font-size: 12px;">
    <div class="box">
        请编写javascript代码，完成如下功能要求：<br />
        <ol>
            <li>
                计算下面文本框中数字之和
                <input type="button" value="点我执行计算" />
            </li>
            <li>
                点我将所有文本框中数字之和，对9求余数，将数字等于余数的文本框前景色改为红色
                <input type="button" value="点我执行计算"/>
            </li>
        </ol>
    </div>
    <div id="mybox" class="box">
        <input type="text" value="1" />
        <input type="text" value="2" />
        <input type="text" value="3" />
        <input type="text" value="4" />
        <input type="text" value="5" />
        <input type="text" value="6" />
        <input type="text" value="7" />
        <input type="text" value="8" />
        <input type="text" value="9" />
    </div>
</body>

Copy after login

Related recommendations:

Usage examples of $.map() in jquery (code)

What selectors does jquery have? Introduction to jquery’s four selectors

The above is the detailed content of How does Jquery implement numerical addition and change the corresponding numerical style according to the remainder (code). For more information, please follow other related articles on the PHP Chinese website!