1

我有一个基本清单：

<select id = "opt">
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="c">c</option>
</select>

现在我必须更改 JS 中的选定项目。它完成了，然后我需要这个选择项的内容（.innerHTML）。但可悲的是，innerHTML 说什么都没有被选中……如何解决这个问题？

编辑：这是代码：

for (var count = 0; count < document.getElementById('opt').childNodes[0].options.length; count++)
{
 if (document.getElementById('opt').childNodes[0].options[count].value == 7) { document.getElementById('opt').childNodes[0].options[count].selected = true; break; }
}
var obj = document.getElementById('opt');
alert (obj.innerHTML);

并且alert()只显示原始的 HTML 代码

4

3 回答 3

2

你可以这样做

var opt = document.getElementById("opt");
var listLength = opt.options.length;
for(var i =0; i< listLength; i++) {
   if(opt.options[i].selected) {
      opt.options[i].textContent = 'the change HTML';
   }
}

演示

于 2012-04-22T11:57:57.480 回答
2

您可以完全不使用选项来执行此操作。

只解析元素的节点

for (var count = 0; count < document.getElementById('opt').childNodes.length; count++)
{
    if (document.getElementById('opt').childNodes[count].value == "c") {       
        document.getElementById('opt').childNodes[count].selected = true; break; 
    }
}
var obj = document.getElementById('opt');
alert (obj.innerHTML);

这是你的工作 jsfiddle：http: //jsfiddle.net/9Pg8n/1/

于 2012-04-22T12:06:46.430 回答
0

您可以从所选选项中读取文本和值，如下所示：

var elem=document.getElementById('opt');
var value=elem[elem.selectedIndex].value;
var text=elem[elem.selectedIndex].text;

如果您确实需要所选元素的 HTML option：

var text=elem[elem.selectedIndex].outerHTML;

如果你偷看select's innerHTML，你可以在 IE 中看到selected属性，但其他浏览器似乎没有反映对属性的更改。这也代表option.outerHTML。

要解决此问题，您需要手动设置属性：

elem[elem.selectedIndex].setAttribute('selected','true');

但是，这对 IE 中的 -value 没有影响innerHTML，因此您会在其他浏览器中获得稍微不同的 HTML。

<OPTION selected ...> // IE
<OPTION selected="true"...> // Other browsers

不幸的是，即使更改选定的元素，这个 set 属性仍然存在。所以使用后必须删除该属性：

elem[elem.selectedIndex].removeAttribute('selected');

但是...这会导致 Chrome 出现问题：它-1从elem.selectedIndex. 您必须selectedIndex在设置属性之前将 存储在变量中，然后再次设置正确的选择：

elem[stored_index].selected=true;
于 2012-04-22T13:16:29.130 回答