Javascript Onchange multiple选择如何汇总其他输入值中的总计

Javascript Onchange multiple选择如何汇总其他输入值中的总计,javascript,php,jquery,html,Javascript,Php,Jquery,Html,我有一个带有onchange功能的选择选项,每当我单击该选项时,它可以更改其他输入中的值 但是,它不适用于仅在选择多个选项时才显示第一个选择选项值的多个选择 HTML选择选项代码 <select class="form-control" onchange="selectFunction(event)" name="pay_course[]" required="" multiple> <option data-typeid="1111" value="courseId1

我有一个带有
onchange
功能的选择选项,每当我单击该选项时,它可以更改其他输入中的值

但是,它不适用于仅在选择多个选项时才显示第一个选择选项值的多个选择

HTML选择选项代码

<select class="form-control" onchange="selectFunction(event)" 
name="pay_course[]" required="" multiple>

  <option data-typeid="1111" value="courseId1">courseName1</option>
  <option data-typeid="2222" value="courseId2">courseName2</option>
</select>

课程名称1
课程2
要显示总数的输入

<input type="number" value="" id="money" class="form-control">

函数脚本

<script>
function selectFunction(e) {
  var type_id = $('select option:selected').attr('data-typeid'); //to get value
  document.getElementById("money").value =type_id;
}
</script>

功能选择功能(e){
var type_id=$('select option:selected').attr('data-typeid');//获取值
document.getElementById(“money”).value=type\u id;
}

当选择了多个选项时,我们需要遍历所有选择的选项,并使用
映射
获取每个选项的
数据类型ID
,如:

功能选择功能(e){
var type_id=$('select option:selected').map(函数(){
返回$(this.attr('data-typeid');
})
.get().map(parseFloat).reduce(函数(a,b){
返回a+b
});
控制台.log(类型\u id)
$(“#money”).val(type#u id);
}

课程名称1
课程2
课程3
课程4



当选择了多个选项时,我们需要遍历所有选择的选项,并使用
映射
获取每个选项的
数据类型ID
,如:

功能选择功能(e){
var type_id=$('select option:selected').map(函数(){
返回$(this.attr('data-typeid');
})
.get().map(parseFloat).reduce(函数(a,b){
返回a+b
});
console.log(类型\u id)
$(“#money”).val(type#u id);
}

课程名称1
课程2
课程3
课程4


使用以下脚本:

   <script>
        function selectFunction(e) {
            var totalMoney = 0; 
            $('select option:selected').each(function(){
               totalMoney += parseInt($(this).attr('data-typeid'));
            });
            $("#money").val(totalMoney);
        }
   </script>

功能选择功能(e){
var totalMoney=0;
$('select option:selected')。每个(函数(){
totalMoney+=parseInt($(this.attr('data-typeid'));
});
美元(“#货币”).val(总货币);
}
使用以下脚本:

   <script>
        function selectFunction(e) {
            var totalMoney = 0; 
            $('select option:selected').each(function(){
               totalMoney += parseInt($(this).attr('data-typeid'));
            });
            $("#money").val(totalMoney);
        }
   </script>

功能选择功能(e){
var totalMoney=0;
$('select option:selected')。每个(函数(){
totalMoney+=parseInt($(this.attr('data-typeid'));
});
美元(“#货币”).val(总货币);
}

我想您在这里有几个选择

第一:如果你能改变

    <option data-typeid="1111" value="courseId1">courseName1</option>

有了它,您可以一次将一个值附加到另一个输入中,或将它们相加或其他任何操作。

我认为您在这里有几个选项

第一:如果你能改变

    <option data-typeid="1111" value="courseId1">courseName1</option>
有了它,您可以一次将一个值附加到另一个输入中,或者将它们相加,或者做其他任何事情