Question

我创建了一个名为＆＃34; text＆＃34;的变量。在javascript中从下拉菜单中获取值。

var text = document.getElementById("dropdown").value;

但是当我加载脚本时，var text仅采用下拉列表的默认值。即使我改变了下拉值，变量的值也保持不变。我希望变量值的值作为下拉值的变化。我在阅读答案后更新了javascript

var text= "hi i am a coder";
var dropdown = document.getElementbyId("dropdown");
dropdown.addEventListener("change", function(){
text = dropdown.value;
});

var storyTextarea = document.getElementById("storytext");
storyTextarea.value = text;

在阅读完答案之后，我尝试了上面的代码，但它并没有奏效。我希望var text通过下拉列表中的更改来更改其值，然后使用带有id =＆＃34; storytext＆＃34;的文本框进行更改。根据变量值更新它的值。请帮忙。我是javascript的新手，请解释一下。我将非常感谢你。 HTML -

<select id="dropdown">
    <option value="text 0">...Select Paragraph...</option>
    <option value="text 1">text1</option>
    <option value="text 2">text2</option>
    <option value="text 3">text3</option>
    <option value="text 4">text4</option>
</select>

<div class="typebox">
            <textarea id="storytext" name="storytext" class="form-control" type="text" readonly="readonly" rows="3"></textarea>
        </div>

Answer 1

var text;
var dropdown = document.getElementbyId("dropdown");
dropdown.addEventListener("change", function(){
text = dropdown.value;
});

Answer 2

您应该在dropdown元素中添加更改侦听器。试试这个例子：

<h1>Current <span id="current"></span></h1>

<select id="animals">
  <option value="dog">Doge</option>
  <option value="cat">Ket</option>
</select>

JS脚本：

var elem = document.getElementById('animals');
var currElem = document.getElementById('current');

currElem.innerHTML = elem.value;

animals.onchange = function(e) {
   currElem.innerHTML = e.target.value;
}

希望有所帮助！：）

Answer 3

当您在开头声明变量文本并且您将为其赋值时，在下拉列表中更改元素时，值不会更改。您必须附加onchange操作，并在onchange函数内指定值。

Answer 4

让我们假设下拉列表的html是这样设置的

<select id="dropdown">
   <option value="text 0">...Select Paragraph...</option>
   <option value="text 1">text1</option>
   <option value="text 2">text2</option>
   <option value="text 3">text3</option>
   <option value="text 4">text4</option>
</select>
<div class="typebox">
   <textarea id="storytext" name="storytext" class="form-control" type="text" readonly="readonly" rows="3"></textarea>
</div>

然后您需要做的是确保只要用户更改性别选项并且onchange事件是发生这种情况的原因就会运行javascript

var text= "hi i am a coder";
var dropdown = document.getElementById("dropdown");
var storyTextarea = document.getElementById("storytext");
storyTextarea.value = text;
dropdown.addEventListener("change", function(){
text = dropdown.value;
  storyTextarea.value = text;
});

gender.addEventListener是用于将更改事件附加到下拉列表的内容。您可以在codepen https://codepen.io/femidotexe/pen/OgvXPo

上查看

如何通过下拉值的变化来改变javascript变量的值？

4 个答案: