Question

需要帮助添加，删除，更改总输入值中无线电输入元素的data-dynamic属性的值。

动态生成的无线电输入

<input type="radio" id="valetId" name="valetId" value="0" data-dynamic="0" />
<input type="radio" id="valetId" name="valetId" value="1" data-dynamic="20" />
<input type="radio" id="valetId" name="valetId" value="2" data-dynamic="40" />

，总输入为：

<input type="text" id="Total" name="Total" class="form-control" value="" />

到目前为止，我有jQuery脚本，它将无线电输入data-dynamic值添加到总数

  $("input[type=radio]").click(function(event) {
    //alert('Button pressed with value: '+dynamicValue);
        $("input[type=radio]:checked").each(function() {
            total = Number($('#Total').val()) + $(this).data('dynamic');
        });
    $('#Total').val(total);
  });

我需要有关如何从总计中删除已检查的无线电输入data-dynamic属性的帮助，如果选中则添加第二个无线电输入data-dynamic属性，或者如果无线电输入{将总输入值重置为原始价格{ {1}}检查属性为0。

感谢。

Answer 1

您应该使用仅在检查收音机时调用的change事件。（未经检查时不会触发，因此您不需要减去）
然后你不必遍历所有的无线电，只需抓住已经检查过的无线电的价值。

var total, myVal;
$("input[type=radio]").change(function(event) {
    // check if 'myVal' variable is defined, if not, set it to the input field value (or 0 if it's empty):
    if(myVal === undefined){
       myVal = ( parseInt($('#Total').val()) || 0);
    }
    total = myVal + parseInt($(this).attr('data-dynamic'));
    $('#Total').val(total);
});

DEMO

修改

如果可以手动更新输入字段value（通过输入），则可以使用此字段。它只会在使用复选框更新不时获取输入字段值：

var inputVal, prevData, total = $('#Total'); $("input[type=radio]").change(function() { var dynamicData = parseInt($(this).attr('data-dynamic')), totalVal = parseInt(total.val()); if(inputVal === undefined || totalVal !== prevData + inputVal){ inputVal = (totalVal || 0); } total.val(inputVal + (prevData = dynamicData)); });

DEMO

确保您的所有无线电都具有唯一 id属性。

使用jQuery根据动态无线电输入属性值更改总输入值

1 个答案: