使用javascript将下拉值传递到文本框

时间:2017-02-10 20:32:39

标签: javascript

我对javascript知之甚少,遗憾的是在此项目到期之前没有时间学习(希望我做到了!)。我假设可以在提交表单之前将下拉选择的值传递到表单上的隐藏文本输入字段。任何人都可以帮我弄清楚如何用javascript做到这一点?谢谢!以下是我的下拉列表和文本框详细信息:

<div class="formEntryArea">
<div class="formEntryLabel">
    <span class="formLabel"><label for=" langdropdown">Would you like to receive library notices in English or Spanish? ><span class="formRequired">*</span></label></span>
</div>
    <div class="formMultiSelect" id=”langdropdown”>
<select name=" langdropdown ">
<option value="0" selected="selected">Choose language</option>
<option value="eng">English</option>
<option value="spa">Spanish</option>
<input type="text" id="ddepartment" name="ddepartment"  value=””>
</select>
</div>

5 个答案:

答案 0 :(得分:1)

这很简单。首先,您必须为change绑定select事件处理程序。然后,您必须设置从input中选择value的{​​{1}}文字。

&#13;
&#13;
dropdown
&#13;
var select=document.getElementsByTagName('select')[0];
var input=document.getElementById('ddepartment');
select.onchange=function(){
  input.value=select.options[select.selectedIndex].text;
}
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以使用此代码:

var myselect = document.getElementById("MySelect");
myselect.onchange = function(){
    alert(myselect.options[myselect.selectedIndex].value);
    document.getElementById("ddepartment").value = myselect.options[myselect.selectedIndex].value;
};

结果: https://jsfiddle.net/fh5myefw/

答案 2 :(得分:0)

注意关闭标签,这是更好的练习。

var select = document.getElementById('selectElem');
var outputElem = document.getElementById('ddepartment');

select.addEventListener('change',function(){
  var newValue = !this.selectedIndex ? "":this.options[this.selectedIndex].text;
  outputElem.value = newValue;
});
    
<select name="langdropdown" id="selectElem" required>
  <option value="" selected="selected">Choose language</option>
  <option value="eng">English</option>
  <option value="spa">Spanish</option>
</select>  
<input type="text" id="ddepartment" name="ddepartment" value="">

答案 3 :(得分:0)

这是javascript函数

function func(selectObject) { document.getElementById('ddepartment').value = selectObject.value; }

添加onchange事件以选择此类元素

<select name="langdropdown" onchange="func(this)">

答案 4 :(得分:0)

这里使用:

var sel = document.getElementById('lang');

sel.onchange = function() {
  var val = this.options[this.selectedIndex].value;
  var che = document.getElementById('cache').value;
  che = val;
  console.log(che);
}

<强>段

var sel = document.getElementById('lang');

sel.onchange = function() {
  var val = this.options[this.selectedIndex].value;
  var che = document.getElementById('cache').value;
  che = val;
  console.log(che);
}
<select id='lang' name="lang">
  <option value="" selected>Choose language</option>
  <option value="eng">English</option>
  <option value="spa">Spanish</option>
  <option value="jpn">Japanese</option>
  <option value="zho">Chinese</option>
  <option value="fin">Finnish</option>
  <option value="nav">Navajo</option>
</select>

<input type="hidden" id="cache" name="cache" value=””>