我有一个选择下拉框,它会在选中时返回一个特定值,这样可以正常工作。然而,我已经尝试添加成人文本形式的数量,以便在按下相同的按钮时返回该值,并且没有任何作用,这让我感到困惑,因为它似乎应该很简单,但我尝试的任何工作都没有,这是我的HTML:< / p>
<form>
<select id = "journeyList">
<option name ="Bristol " value="40">Bristol - Newcastle</option>
<option name ="London " value="35" >Bristol - London</option>
<option name ="Glasgow " value="70" >Glasgow - Manchester</option>
</select><br><br>
</form>
Number of Adults:
<form>
<input type = "number" name ="adult" id="ofAdults" value="" required>
</form>
<button type="button" onclick="BookingFare(); return false;">Submit</button><br>
使用Javascript:
function BookingFare() {
var journeyList = document.getElementById("journeyList");
var price = journeyList.options[journeyList.selectedIndex].value;
var Adults = getElementById("ofAdults").value;
//var ofChildren = getElementById('children').value;
//var Discount
//var Total
//var SeatsLeft
if (journeyList == 40) {
var price = journeyList.value;
}
if (journeyList == 35) {
var price = journeyList.value;
}
if (journeyList == 70) {
var price = journeyList.value;
}
document.getElementById('priceBox').innerHTML = price;
document.getElementById('adultsBox').innerHTML = Adults;
}
这只是我遇到问题的成年人的回归价值。
答案 0 :(得分:0)
您缺少“文档”。访问ofAdults元素时。
应该是
var Adults = document.getElementById("ofAdults").value
答案 1 :(得分:0)
HTML
<select id = "journeyList">
<option name ="Bristol " value="40">Bristol - Newcastle</option>
<option name ="London " value="35" >Bristol - London</option>
<option name ="Glasgow " value="70" >Glasgow - Manchester</option>
</select><br><br>
Number of Adults:
<form>
<input type = "number" name ="adult" id="ofAdults" value="" required>
<button type="button" onclick="BookingFare(); return false;">Submit</button><br>
<div id="priceBox"></div>
<div id="adultsBox"></div>
JAVASCRIPT
function BookingFare() {
var journeyList = document.getElementById("journeyList");
var price =journeyList.options[journeyList.selectedIndex].value;
var Adults = document.getElementById("ofAdults").value;
document.getElementById('priceBox').innerHTML = price;
document.getElementById('adultsBox').innerHTML = Adults;
}
这将显示div中的当前列表值和文本框值
<强> DEMO 强>
<强>注1:强> 你的if语句需要一些修改
在你的情况下,journeyList是一个对象,所以你不能直接做下面的事情
if (journeyList == 40) {
var price = journeyList.value;
}
如果你想做某事,那么你必须这样做
if (journeyList.options[journeyList.selectedIndex].value== '40')
{
// your code goes here
}
注意2:通常我们在onchange事件中获取选择值。所以我最好使用onchange事件,然后点击这里不需要按钮就可以看到选择更改时的详细信息。
如果您想以这种方式使用,请使用以下代码
<select id = "journeyList" onchange="BookingFare();">
<option name ="Bristol " value="40">Bristol - Newcastle</option>
<option name ="London " value="35" >Bristol - London</option>
<option name ="Glasgow " value="70" >Glasgow - Manchester</option>
</select><br><br>
Number of Adults:
<form>
<input type = "number" name ="adult" id="ofAdults" value="" required>
<button type="button">Submit</button><br>
<div id="priceBox"></div>
<div id="adultsBox"></div>
<强> JS 强>
function BookingFare() {
var journeyList = document.getElementById("journeyList");
var price =journeyList.options[journeyList.selectedIndex].value;
var Adults = document.getElementById("ofAdults").value;
document.getElementById('priceBox').innerHTML = price;
document.getElementById('adultsBox').innerHTML = Adults;
}
无需点击按钮 这里
<强> DEMO 强>