使用Jquery的简单HTML计算器

时间:2010-07-22 02:56:54

标签: jquery html

我需要一个简单的计算器,您只需更改一个数字,它就会将值乘以数字

即。如果您将数字从1切换到3,则会发生以下情况。值可以是文本框,其他可以是标签

number to buy   1   
    $175.00 YR 1
    $187.50 YR 2
    $212.50 YR 3
    $225.00 YR 4
    $237.50 YR 5



number to buy   3   
    $525.00 YR 1
    $562.50 YR 2
    $637.50 YR 3
    $675.00 YR 4
    $712.50 YR 5

1 个答案:

答案 0 :(得分:3)

http://jsfiddle.net/gL2kY/我在这里制作了一些代码......

喝彩!

(回到一小时后,我需要休息一下。)

的jQuery

$('p span').each(function(){
    $(this).data('factor',$(this).text());
});
$('#factor').keyup(function(){
    var factor = this.value;
    $('p span').each(function(){
        $(this).text(function(){
            return $(this).data('factor') * factor;
        });
    });
});

的HTML

<span>number to buy</span>
<input type="text" value="1" id="factor" />   
<p>    $<span>175.00</span> YR 1 </p>
<p>    $<span>187.50</span> YR 2</p>
<p>    $<span>212.50</span> YR 3</p>
<p>    $<span>225.00</span> YR 4</p>
<p>    $<span>237.50</span> YR 5</p>​