如何访问Init上隐藏的动态生成选择列表的表单元素值

Question

我已将动态生成的<select>列表写入默认的visible | div |和一个隐藏的| div |在我的HTML中。

<div id="Tab1">
  <select id="img">
    <option value="1">My Img</option>
  </select>
  <button onclick="passSelectedValue('file')" />
</div>

<div id="Tab2" class="hidden">
  <select id="parent_page">
    <option value="2">My Page</option>
  </select>
  <button onclick="passSelectedValue('page')" />
</div>

当用户看到它并且用户进行选择并单击按钮时，我无法检索所选值，它返回NULL值。我已经阅读了关于代表团的文章，但我不确定我是否正确接近这一点。我的第一个| div |在页面加载后可见，我可以毫无问题地访问该值。请注意，我只生成| select |在| divs |中列出，按钮被硬编码到页面中。当我单击该按钮并以“page”作为参数触发该函数时，一切正常，只有select元素的值返回NULL。我在想我的选择列表是隐藏的| div |未在DOM中注册？我如何得到| select |列表中隐藏的| div |注册并可以访问？

function passSelectedValue(argForm){
    var my_value = '';
    if (argForm=='file') {
        my_value = document.getElementById('img').value;
    };
    if (argForm=='page') {
        my_value = document.getElementById('parent_page').value;
    };      
    setFormValue(my_value,argForm);
};

Answer 1

您无法以与输入字段相同的方式检索选择框的值。

你需要这样做：

var selectBox = document.getElementById('img');
var my_value = selectBox.options[selectBox.selectedIndex].value;