Question

div的文本需要成为生成的选择下拉列表的选定选项。我成功创建了下拉列表并替换了div但是，设置所选选项的值不会被选中。

下面是我如何获得div值以及我如何创建下拉列表

<script type="text/javascript">

var d = document.getElementById("val_to_set");

 var rvalue = d.innerHTML;    //Getting the value of div

//The options of a dropdown are populated from another dropdown menu 

 var listOptions =  document.getElementById("dropdown");

 var newddown = '<select name="displayoption">'+listOptions.innerHTML+'</select>';

 //Replace the div with the created dropdown menu 

d.innerHTML = newddown;    //TARGET ELEMENT

</script>

我找到了这个链接，解释了如何按值，文本或索引进行选择

[1] http://www.daftlogic.com/information-programmatically-preselect-dropdown-using-javascript.htm

当尝试获取新创建的下拉列表的选项时，我得到＆＃34;选项未定义＆＃34;

新的下拉列表不会选择给定的选项 - 我已经尝试了给定链接中的所有情况，包括在我用下拉列表替换div之前添加以下行。

var seeker = ">"+rvalue+"<";
newddown = newddown.replace(seeker, "selected"+seeker);

我做错了什么？我是jQuery的初学者，我想坚持使用JavaScript。

已编辑 - 包含的下拉列表用于填充目标元素的选项

<select id="dropdown" name="listedoptions" >
<?php

echo "    <option value=''></option>  \n";
          $ores = sqlStatement("SELECT option_id, title, is_default FROM list_options" .
                  " WHERE list_id = 'adjreason'  ORDER BY seq, title");

            while ($orow = sqlFetchArray($ores)) {
            echo "    <option value='" . $orow['option_id']). "'";
            echo ">" . $orow['title'] . "</option>\n";
            } 
 ?>
 </select>

Answer 1

以下是使用您的代码和一些示例选项的工作示例：

http://jsfiddle.net/m6y3mgky/

不是替换文本，而是很容易迭代选项并以编程方式选择正确的选项，这是根据您引用的文章。这也不容易出错。

var opts = d.childNodes[0].options;
for (var i = 0; i < opts.length; i++) {
    if (opts[i].value == rvalue) {
        opts[i].selected = true;
        break;
    }
}

注意： d引用＆lt; div＆gt;，而不是＆lt; select＆gt;节点，这是因为您使用的是innerHTML。

将div文本转换为下拉列表，div文本是选定的选项

1 个答案: