将外部javascript文件中的变量传递到html中的值上

Passing a variable from an external javascript file onto a value in html?

本文关键字：html 变量 外部 javascript 文件      更新时间：2023-09-26

我正在制作一个"购物表单"，通过更改.js中的单个变量，我可以在外部.js文件中编辑价格，并将反映在我的html中的一个值中，该值将合计总成本。

名为"prices.js"的Javascript文件

var x = "100.00";
var y = "200.00";

我的html:

<input type="hidden" name="item_name_1" value="Banana for Sale">
<input class="amount" type="hidden" name="amount_1" value=x>
<input type="hidden" name="item_name_2" value="Orange for Sale">
<input class="amount" type="hidden" name="amount_2" value=y>

从本质上讲，我试图将外部javascript中的"x"answers"y"变量传递到html中每个项目的"值"上。我对此一无所知，所以上述内容显然不起作用。

为了澄清，我不需要代码立即写入值，只需要更改值，以便它可以由另一个函数（已经处理好了）编写，该函数将上面所有项目的所有金额相加。

谢谢大家的帮助！

您可以使用getElementsByName查找隐藏变量，然后用x的值填充它。下面的JavaScript需要保存到您的prices.js文件中。为了澄清，getElementsByName返回了一个数组，所以我使用第一个条目来设置value字段。

x = 10
y = 5
document.getElementsByName("amount_1")[0].value = x
document.getElementsByName("amount_2")[0].value = y
document.write(document.getElementsByName("amount_1")[0].value + '<br>')
document.write(document.getElementsByName("amount_2")[0].value + '<br>')
<input class="amount" type="hidden" name="amount_1" value="">
<input class="amount" type="hidden" name="amount_2" value="">

尝试使用.val()和class选择器将变量分配给inputs，例如：

<script>
    $(function(){
        $('.amount_1').val(x);
        $('.amount_2').val(y);
    })
</script>

希望这能有所帮助。

相关文章：