Javascript 如何在下拉列表中设置正确的值

Javascript 如何在下拉列表中设置正确的值,javascript,html,css,Javascript,Html,Css,我在尝试从下拉列表中设置正确答案时遇到困难。我目前正在做的是向用户显示一个带有空格的问题,然后用户可以从下拉列表中的值选择这些空格中应该包含的内容 我是否可以从列表中设置正确的值 我有一个简单的下拉列表 <select id="button1" class="button" title="Button 1"> <option value="">--Please choose an option for the first blank--</option> &l

我在尝试从下拉列表中设置正确答案时遇到困难。我目前正在做的是向用户显示一个带有空格的问题,然后用户可以从下拉列表中的值选择这些空格中应该包含的内容

我是否可以从列表中设置正确的值

我有一个简单的下拉列表

<select id="button1" class="button" title="Button 1">
<option value="">--Please choose an option for the first blank--</option>
<option id="buttonText1_1" class="buttonText">1</option>
<option id="buttonText1_2" class="buttonText">2</option>
<option id="buttonText1_3" class="buttonText">3</option>
<option id="buttonText1_4" class="buttonText">4</option>
<option id="buttonText1_5" class="buttonText">5</option>
<option id="buttonText1_6" class="buttonText">6</option>
</select>
谢谢

您需要为列表中的每个项目添加“value”属性。 所选答案将“值”传输到“button1”元素。之后,您可以检查该值是否正确


--请为第一个空格选择一个选项--
1.
2.
3.
4.
5.
6.

这可能就是您要查找的内容:如果未明确指定值,则会自动将选项的文本内容用作值。
.buttonText {
  padding: 20px;
  display: block;
}
.button {
  width: calc(100% - 4px);
  position: relative;
  margin-bottom: 20px;
  text-align: center;
  background-color: #F8F8F8;
  border: 2px solid #EAEAEA;
  border-radius: 6px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  max-width: 500px;
  min-height: 65px !important;
}