0
我需要显示/下拉列表从HTML页面的选定值重定向到一个新的一页。代码无法执行。需要关于这个的帮助（使用javascript）。下拉列表项的值传递到另一个页面作为查询字符串
这些都是“mainTest.html”文件中的代码。我在将页面重定向到另一个HTML页面时遇到了问题。
< script type = "text/javascript" >
(function() {
/**
* Handles the click of the submit button.
*/
function onSubmitClicked(event) {
// Get the input element from the DOM.
var beverage = document.getElementById('foodbeverage'),
// Get the value from the element.
beverageValue = beverage.value,
// Construct the URL.
url = 'newPageTest.html?foodbeverage=' + encodeURIComponent(beverageValue) + '&status=' + encodeURIComponent(status);
// Instead of going to the URL, log it to the console.
console.log('goto to URL: ', url);
}
// Get the button from the DOM.
var submitButton = document.getElementById('btngo');
// Add an event listener for the click event.
submitButton.addEventListener('click', onSubmitClicked);
})(); <
/script><!DOCTYPE html>
<html>
<body>
<div align="center"></div>
<center>
<h4 style="color:darkblue">Choose Your Food/Beverage & Quantity : </h3>
</center>
<table>
<tr>
<td>
<font size=2>
<B>Choose a Food/Beverage : </B>
</font>
<select ID="foodbeverage">
\t
\t <optgroup label="DEFAULT">
\t <option value = "NONE">NONE</option>
\t </optgroup>
\t
\t <optgroup label="Food">
\t <option value = "chickenchop">Chicken Chop</option>
\t <option value = "pasta">Pasta</option>
\t <option value = "pizza">Pizza</option>
\t <option value = "chocolate">Chocolate Cake</option>
\t <option value = "redvelvet">Red Velvet Cake</option>
\t <option value = "icecream">Ice Cream Cake</option>
\t </optgroup>
\t
\t <optgroup label="Beverages">
\t <option value = "milk">Milk</option>
\t <option value = "freshjuice">Fresh Juice</option>
\t <option value = "icecream">Ice Cream</option>
\t <option value = "coffee">Coffee</option>
\t <option value = "carbonated">Carbonated Can Drink</option>
\t <option value = "water">Water</option>
\t </optgroup>
\t
\t </select>
<br/>
<font size=2>
<B>Choose a Food/Beverage : </B>
</font>
<select ID="foodbeverage1">
\t
\t <optgroup label="DEFAULT">
\t <option value = "NONE">NONE</option>
\t </optgroup>
\t
\t <optgroup label="Food">
\t <option value = "chickenchop">Chicken Chop</option>
\t <option value = "pasta">Pasta</option>
\t <option value = "pizza">Pizza</option>
\t <option value = "chocolate">Chocolate Cake</option>
\t <option value = "redvelvet">Red Velvet Cake</option>
\t <option value = "icecream">Ice Cream Cake</option>
\t </optgroup>
\t
\t <optgroup label="Beverages">
\t <option value = "milk">Milk</option>
\t <option value = "freshjuice">Fresh Juice</option>
\t <option value = "icecream">Ice Cream</option>
\t <option value = "coffee">Coffee</option>
\t <option value = "carbonated">Carbonated Can Drink</option>
\t <option value = "water">Water</option>
\t </optgroup>
\t
\t </select>
<br/>
</td>
<td>
<font size=2>
<B>Dine In or Take Away : </B>
</font>
<select ID="status">
\t
\t <optgroup label="DEFAULT">
\t <option value = "NONE">NONE</option>
\t </optgroup>
\t
\t <optgroup label="STATUS">
\t <option value = "dinein">Dine In</option>
\t <option value = "takeaway">Take Away</option>
\t </optgroup>
\t </select>
<br/>
<font size=2>
<B>Dine In or Take Away : </B>
</font>
<select ID="status1">
\t
\t <optgroup label="DEFAULT">
\t <option value = "NONE">NONE</option>
\t </optgroup>
\t
\t <optgroup label="STATUS">
\t <option value = "dinein">Dine In</option>
\t <option value = "takeaway">Take Away</option>
\t </optgroup>
\t </select>
<br/>
</td>
</tr>
</table>
<br/>
<br/>
<input type="submit" id="btngo" value="Go" />
<br/>
</body>
</html>这些是下拉选择的值将被显示的“newPageTest.html”文件中的代码。
< script type = "text/javascript" >
window.onload = passParameters;
//Function to update "showdata" div with URL Querystring parameter values
function passParameters() {
var foodbeverage = getParameterByName("foodbeverage");
var status = getParameterByName("status");
if (foodbeverage != null && status != null) {
var data = "<b>Food Beverages:</b> " + foodbeverage + " <b>Dine Takeaway:</b> " + status;
document.getElementById("showdata").innerHTML = data;
}
}
//Get URL parameter value
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
} <
/script><!DOCTYPE html>
<html>
<body>
<div id="showdata" align="center"></div>
<font size=6>
<B>Food/Beverage Selected : </B>
</font>
<br/>
<br/>
<font size=6>
<B>Dine In/Take Away : </B>
</font>
<br/>
<br/>
</body>
</html>
。你甚至阅读的代码？我在你之前的问题的第一个片段中做了这个方法，代码评论甚至说没有重定向发生。你只是复制粘贴而不看它。 – Thijs
@Thijs很抱歉，我按照你所说的做了，仍然没有重定向，这些都是你完成的原始代码。我猜这个问题在别的地方。我试图在按钮代码之间放入