Javascript 使用JS获取值拆分值并在输入中显示

我需要从选择中获取一个值，然后添加这些值并在输入框中显示总计。只要我不使用分割，它就可以工作，但我需要分割，因为我需要在值中使用两个不同的值。我知道我的分手中有错误，但就是想不出来。任何帮助都会很好

就像我说的，如果我去掉分割并在select的值中只使用数字，那么脚本工作得很好，但是我需要在select的值中使用两个不同的值，然后分割它并从分割中获得第二个数字。例1-15我需要将15添加到其他

<div class="row">
<div class="col-12 col-sm-12">
    <div class="card h-100">
        <div class="card-header">Select 4 Products</div>
        <div class="card-body" style="padding: 20px 30px 15px 30px;">
        <p style="font-size:18px; text-align:center; font-weight:bold;">BV Needed For Platinum Package: 75</p>
            <p style="font-size:20px; color:red; text-align:center; font-weight:bold;">Current BV:  <input type="text" name="bv" id="bv" value="0" readonly></p>
            <br />
            <div class="row text-center">
                <div class="col-3 text-center">
                    <select name="product1" class="form-control" id="p1" onchange="updateDue()">
                        <option value="" >Please Select A Product</option>                                    
                        <option value="1|15">Product 1</option>
                        <option value="2|13">Product 2</option>
                        <option value="3|9">Product 3</option>
                        <option value="4|8">Product 4</option>
                        <option value="5|13">Product 5</option>
                        <option value="6|13">Product 6</option>
                    </select>
                </div>

                <div class="col-3 text-center">
                    <select name="product1" class="form-control" id="p2" onchange="updateDue()">
                        <option value="" >Please Select A Product</option>                                    
                        <option value="1|15">Product 1</option>
                        <option value="2|13">Product 2</option>
                        <option value="3|9">Product 3</option>
                        <option value="4|8">Product 4</option>
                        <option value="5|13">Product 5</option>
                        <option value="6|13">Product 6</option>
                    </select>
                </div>

                <div class="col-3 text-center">
                    <select name="product1" class="form-control" id="p3" onchange="updateDue()">
                        <option value="" >Please Select A Product</option>                                    
                        <option value="1|15">Product 1</option>
                        <option value="2|13">Product 2</option>
                        <option value="3|9">Product 3</option>
                        <option value="4|8">Product 4</option>
                        <option value="5|13">Product 5</option>
                        <option value="6|13">Product 6</option>
                    </select>
                </div>

                <div class="col-3 text-center">
                    <select name="product1" class="form-control" id="p4" onchange="updateDue()">
                        <option value="" >Please Select A Product</option>                                    
                        <option value="1|15">Product 1</option>
                        <option value="2|13">Product 2</option>
                        <option value="3|9">Product 3</option>
                        <option value="4|8">Product 4</option>
                        <option value="5|13">Product 5</option>
                        <option value="6|13">Product 6</option>
                    </select>
                </div>


            </div>
        </div>
    </div>
</div>

选择4种产品
白金包装需要BV:75

当前BV:



请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6

//

---

这方面的任何帮助都会很好。我一直漫无边际的唯一原因是因为这个表单让我添加了更多的细节，但我已经添加了所有的细节。它一直说我的帖子大部分都是代码，这太疯狂了，我可以添加多少细节让它消失。所以如果你还在读这篇文章，我很抱歉，这只是为了让那个愚蠢的错误消失。他们真的应该解决这个问题，因为不是所有的问题都需要一本详细的手册

var val1 = parseInt(document.getElementById("p1").value);

如果内容为“1 | 15”，则结果为1，因此第二个数字已消失

将该行更改为：

var val1 = document.getElementById("p1").value;

为了得到总和，您只需在每个附录前面加上加号：

ansD.value = +val1 + +val2 + +val3 + +val4;

片段：

函数updateDue（）{
var val1=document.getElementById（“p1”）.value；
var val2=document.getElementById（“p2”）.value；
var val3=document.getElementById（“p3”）.value；
var val4=document.getElementById（“p4”）.value；
var realbv1=val1.split（“|”）；
var realbv2=val2.split（“|”）；
var realbv3=val3.split（“|”）；
var realbv4=val4.split（“|”）；
如果（！realbv1[1]）{val1=0；}否则{val1=realbv1[1]；}
如果（！realbv2[1]）{val1=0；}否则{val2=realbv2[1]；}
如果（！realbv3[1]）{val1=0；}否则{val3=realbv3[1]；}
如果（！realbv4[1]）{val1=0；}否则{val4=realbv4[1]；}
var ansD=document.getElementById（“bv”）；
ansD.value=+val1++val2++val3++val4；
}

选择4种产品
白金包装需要BV:75

当前BV:



请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6
请选择一个产品
产品1
产品2
产品3
产品4
产品5
产品6

您的问题在这行中…：

var val1 = parseInt(document.getElementById("p1").value);

如果内容为“1 | 15”，则结果为1，因此第二个数字已消失

将该行更改为：

var val1 = document.getElementById("p1").value;

为了得到总数，你可以简单地