分配一个 javascript 变量值取决于 html 下拉列表部分
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17931843/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
assign a javascript variable value depends on html drop down list section
提问by acr
I have a drop html list. If I select an option from dropdown, I have to assign dropdown value to the javascript variable and display it on html
我有一个下拉 html 列表。如果我从下拉列表中选择一个选项，我必须将下拉值分配给 javascript 变量并将其显示在 html 上
Here is my code
这是我的代码
HTML:
HTML：
<form method="post">
<select id="dropdown" name="dropdown" onchange="changeHiddenInput(this)">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<input type="hidden" name="hiddenInput" id="hiddenInput" value="" />
<button onclick="changeHiddenInput (objDropDown)">Try it</button>
</form>
<div id="result"> </div>
Javascript:
Javascript：
function changeHiddenInput (objDropDown)
{
var objHidden = document.getElementById("hiddenInput");
objHidden.value = objDropDown.value;
var a = objHidden.value;
result.innerHTML = a || "";
}
But whenever I am submitting the values,it giving error. anything wrong here ?
但是每当我提交值时，它都会出错。这里有什么问题吗？
采纳答案by Sergio
On your demo, you've selected the default onLoad option in jsfiddle. This causes the site to wrap your entire code within a callback function, meaning that your showit function is not a global function as required by DOM0 inline event handlers.
在您的演示中，您选择了 jsfiddle 中的默认 onLoad 选项。这会导致站点将您的整个代码包装在一个回调函数中，这意味着您的 showit 函数不是 DOM0 内联事件处理程序所要求的全局函数。
Change this option to no wrap(head) and it will work.
将此选项更改为 no wrap(head) 它将起作用。
The code you have will work good on a page, assuming you have the <script>tags for the javascript.
假设您有<script>javascript的标签，您拥有的代码将在页面上运行良好。
About your <button onclick="changeHiddenInput (objDropDown)">Try it</button>, objDropDownis not defined... and also add type="button"otherwise the default is a submit button.
关于您的<button onclick="changeHiddenInput (objDropDown)">Try it</button>,objDropDown未定义...并且还添加type="button"其他默认值是提交按钮。
I made some changes for the demo, so my code is:
我对演示做了一些更改，所以我的代码是：
html
html
<form method="post">
<select id="dropdown" name="dropdown" onchange="changeHiddenInput(this)">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<input type="hidden" name="hiddenInput" id="hiddenInput" value="" />
<button onclick="changeHiddenInput (objDropDown)">Try it</button>
</form>
<div id="result"> </div>
javascript
javascript
var select;
window.onload = function () {
select = document.getElementById('dropdown');
console.log(select);
}
function changeHiddenInput(objDropDown) {
console.log(objDropDown);
var objHidden = document.getElementById("hiddenInput");
objHidden.value = objDropDown.value;
var a = objHidden.value;
result.innerHTML = a || "";
}
