如何从选择下拉列表中选择和选项使用JS

由于某些原因，我很难在选择下拉菜单中使用选项的值。下面是代码：“无法设置属性格式的未定义‘选择’如果我更换如何从选择下拉列表中选择和选项使用JS

<select id="select_category" name="select_category"> 
    <option value=""></option> 
    <option value="home">Home</option> 
    <option value="office">Office</option> 
    <option value="dinning_room">Dinning Room</option> 
</select> 

<script> 
var select_category = document.getElementById("select_category"); 
select_category.options["home"].selected = true; 
</script>

当我运行此我得到的错误[”家“]与[2]在最后一行它的工作原理为何。我无法通过我分配给它的值引用选项

感谢

编辑 - ？的建议，改变了javascript来此之下，但现在我得到的错误“令牌非法”

document.getElementById('select_category').value = 'home';

来源

2013-07-26 Danconia

的document.getElementById（“select_category”）值=“家”; – DevlshOne

select_category.options["home"].selected = true;

此行不工作因为选项需要一个索引（即num如你上面发现的那样）。

http://www.w3schools.com/jsref/coll_select_options.asp

给每个选项的名称，并使用此：

select_category.options.namedItem("nameGoesHere").selected = true;

或者，你可以给每个选项的标识和使用说明：

document.getElementById("home").selected = true;

（假设的标识在这种情况下选项是“home”

来源

2013-07-26 17:37:46 Lebowski156

我怎样才能设置一个选项使用的值（我应该在每个选项上放一个ID？） – Danconia

如果你在每个选项上放一个ID就可以了。值仅用于向用户显示文本。由于您可能有两个具有相同值的选项，因此它不可用作唯一标识符。使用id的话，如果你有id =“home”，那么你确切知道[“home”]所指的是哪一个选项，因为你的id =“home”不能有多个选项。这就是为什么价值不被用作标识符。 – Lebowski156

好吧，试着这样做，现在得到错误“意外标识符”。现在每个选项都被定义为 ....并且JS是：var select_category = document.getElementById（“select_category”）; select_category.options [“home_option”]。selected = true; – Danconia

尝试th是一个：

document.getElementById("select_category").options[1].selected = true;

如果你想通过使用值进行设置这样的：

document.getElementById('select_category').value = 'home';

来源

2013-07-26 17:37:29 Niklas

是的，但我需要通过做值来自这是来自一个变量 – Danconia

我试着做你说的，但现在我得到'令牌非法'错误（见上面的编辑）。 – Danconia

你想在元素被渲染之前设置它的值吗？ – Niklas

document.getElementById('select_category').value = 'home';

jsFiddle Demo

来源

2013-07-26 17:37:30 DevlshOne

这实际上比我提出的要好得多。 – quinnirill

但是，我该如何将所选项目设置为该项目？ – Danconia

@LuisP这正是它所做的。使用我发布的jsFiddle演示来尝试其他选项。 – DevlshOne

因为选项是一个数组。可以写这样的功能，但：

function selectOptionByValue (select, value) { 
    for (var i = 0; i < select.options.length; i++) { 
     select.options[i].selected = select.options[i].value === value; 
    } 
}

来源

2013-07-26 17:41:17 quinnirill

如何从选择下拉列表中选择和选项使用JS

回答

相关问题