javascript - 由于炒作，Javascript 无法工作

Question

从我的小提琴

<select id="doesnt-work">
  <option>Apple</option>
  <option>Orange</option>
  <option value="111">Pineapple</option>
  <option>Banana</option>
</select>
<input type="textbox" id="mytextbox"/>
<button onclick="displayResult(doesnt-work)">Click me</button> 

JavaScript

function displayResult(selTag)
{
var x=selTag.options[selTag.selectedIndex].text;
document.getElementById('mytextbox').value = x;
}

我知道它不起作用，因为“不起作用”之间的连字符

我需要使用连字符，因为它是由我的应用程序自动创建的，我无法控制它。

有谁知道怎么做？

Answer 1

您依赖于 JavaScript 的错误部分。您不应该使用元素 ID 并让浏览器自动连接它。像设置值时一样使用 getElementById。

HTML：

<button onclick="displayResult('doesnt-work')">Click

JavaScript：

function displayResult (selId) {
    var selTag = document.getElementById(selId);
    var x=selTag.options[selTag.selectedIndex].text;
    document.getElementById('mytextbox').value = x;
}

Answer 2

连字符不是问题。您必须将 id 作为字符串传递给函数：

<button onclick="displayResult('doesnt-work')">Click me</button>

要获取选定的文本：

var selectBox = document.getElementById(selTag);
var x=selectBox.options[selectBox.selectedIndex].text;

Answer 3

将 id 作为字符串传递，而不是对象本身；

<button onclick="displayResult('doesnt-work')">Click me</button> 

然后将其解析为函数中的对象

function displayResult(id)
{
var selTag = document.getElementById(id);
var x = selTag.options[selTag.selectedIndex].text;

Answer 4

如果您可以document.getElementById改用：

<button onclick="displayResult(document.getElementById('doesnt-work'))">Click me</button>