Question

我试图将根据产品选择的价值传递给第三方支付平台;因此，我使用如下代码：

HTML：

<select class="form-control" id="sel1" name="ItemDesc" onchange="passPrice();">
    <option value="prodA">prodA</option>
    <option value="prodB">prodB</option>
    <option value="prodC">prodC</option>
</select>
<div id="price" class="form-control">
    <input type="hidden" id="priceAmt" name="Amt" value="0">            
</div>

JS：

var prc = new Array();
var theForm = document.forms["shoppingCart"];
prc["prodA"] = 100;
prc["prodB"] = 200;
prc["prodC"] = 300;

function getPrice(){
    var prodPrice = 0;
    var prod = theForm.elements["sel1"];
    prodPrice = prc[prod.value];
    return prodPrice;
}
function passPrice(){
    document.getElementById("priceAmt").value = getPrice();
}

当我测试它时，错误消息显示＆＃34; Uncaught TypeError：无法读取属性＆＃39;值＆＃39; of null＆＃34;。然后当我再次使用document.getElementById（＆＃34; priceAmt＆＃34;）时，它返回 null 。
但是，当我使用控制台逐行执行代码时，它可以正常工作，如下所示：

getPrice(); //it returns 100 by default
document.getElementById("priceAmt").value = getPrice(); //it also returns 100

我搜索了相关的关键字，但没有找到类似的情况。在这种情况下可能出现什么问题？

10月26日编辑：我通过将输入元素priceAmt从分区中删除来解决了这个问题，但仍然很好奇为什么原始方法不起作用。

使用javascript动态更改表单中的值

0 个答案: