onChange不适用于自动填充的字段

时间:2017-01-06 00:37:13

标签: javascript sum onchange

我创建了一个受益人表单,当用户选择受益人时自动填充指定的百分比。例如,用户可以选择子级1,并根据他们在另一个表中为子级1指定的百分比份额,自动填充此表单中的百分比(函数beneficiary_1())。我为每个百分比字段创建了一个单独的onChange脚本来总结所有百分比,但我认为它不适用于自动填充的字段...

function percentSum(){
    var arr = document.getElementsByName('beneficiary_share');
    var tot=0;
    for(var i=0;i<arr.length;i++){
        if(parseInt(arr[i].value))
            tot += parseInt(arr[i].value);
    }
    document.getElementById('total_percentage').value = tot;
}

有没有办法可以修改它,以便它适用于自动填充的字段?

HTML:

<tr>
  <td style="border-right: 1px solid #000000;">
    <g:ui_reference name="family_member_1" id="family_member_1" table="hr_beneficiary" query = "active=true^employee=javascript:gs.getUserID()" completer="AJAXTableCompleter" columns="employee; beneficiary_contact.relationship" onChange="beneficiary_1()" />
  </td>
  <td class = "inside"><input class = "sf2823"  type="text" id="fm1_ssn" name ="fm1_ssn" style="background-color:#dddddd" readonly="readonly"/>
  </td>
  <td class = "inside"><input class = "sf2823" type="text" id="fm1_address" name ="fm1_address" style="background-color:#dddddd" value="" readonly="readonly"/>
  </td>
  <td class = "inside"><input class = "sf2823" type="text" id="fm1_relationship" name ="fm1_relationship" style="background-color:#dddddd" value="" readonly="readonly"/>
  </td>
  <td><input class = "sf2823" type="text" id="fm1_percentage" name ="beneficiary_share" style="background-color:#dddddd" value="" readonly="readonly" onChange="percentSum()"/>  
  </td>
</tr>

1 个答案:

答案 0 :(得分:0)

你必须从更高的DOM元素听。

例如:

$(document).on('change', '#beneficiary_share', percentSum);

添加新元素时,将调用percentSum函数。