在表单中添加所有值并在禁用的输入中显示

时间:2014-01-21 21:48:27

标签: javascript jquery math

我有一张表格,其中有不同数额的钱需要记录。由于我在代码中使用JavaScript中的data-*属性显示了各种元素,在本例中为data-money="100"

如何使用JavaScript添加所选的所有金额,并将其显示在已禁用的输入中?这将在以后注入数据库。

我真的不知道如何处理这个以及它需要多么复杂,否则我会尝试一些东西。这就是我要问的原因。

页面上是否需要JS?在HTML中?或者我可以从我的JQuery文件中控制所有内容吗?

示例代码:

<div class="form-group">
            <label for="inscriptionPaid" class="col-sm-2 control-label">Enrolment paid</label>
            <div class="col-sm-10">
              <label class="radio-inline">
              <input type="radio" name="inscriptionPaid" id="inscriptionPaid" data-money="800" value="yes" > Yes 
            </label>
            <label class="radio-inline">
              <input type="radio" name="inscriptionPaid" id="inscriptionPaid" data-money="0" value="no" checked> No 
            </label>
            </div>
          </div>
<div class="form-group">
            <label for="paidFor" class="col-sm-2 control-label">Paid for</label>
            <div class="col-sm-10">
              <select id="paidFor" class="form-control">
                <option value="0">Choose Option</option>
                <option data-money="3600">IELTS - $3,600</option>
                <option disabled role="separator">---------------</option>
                <option data-money="3600">General English weekdays - $3,600</option>
                <option data-money="2800">General English Saturdays - $2,800 </option>
            </select>
            </div>
          </div>

修改 我设法做到这一点,但它没有识别data-money标签的数量,我尝试更改$(this)each.(function()部分,但我无法获取它来获取信息。

$('*[data-money]').change(function(){
var sum = 0;
$(this).each(function() {
    sum += Number($(this).val());
});
 $("#totalPaid").val(sum);
});

3 个答案:

答案 0 :(得分:1)

你的意思是that只是简单地使用jquery

 var sum=0;
    $("option").each(function() {

        if(parseInt($(this).attr("data-money"))&&$(this).attr("selected"))  
        sum=sum+parseInt($(this).attr("data-money") )


    });
    $("#test").val(sum) //this is the disabled input element

答案 1 :(得分:1)

把它放到你的jQuery某处:

totalPrice = 0;
$("[data-money]:selected, [data-money]:checked").each(function() {
    totalPrice += Number($(this).attr("data-money"));
});

这个想法是让所有元素都具有data-money属性。然后你要做的就是遍历它们并将data-money属性的值添加到某个变量中。我希望这就是你要找的东西。 (JSFiddle如果你想要的话)

答案 2 :(得分:1)

迭代所有数据资金并将输出放在标签中,这是一个小提琴http://jsfiddle.net/3mLjR/

var sum = 0;
$("[data-money]").each(function(e){
sum +=$(this).data("money");
});
console.log(sum)
$("#output").text(sum);