Javascript在下拉更改时设置隐藏的表单值

Question

javascript新手,但我确信这很容易.不幸的是,大多数谷歌搜索结果都没有帮助.

无论如何,我想在下拉选择更改时通过javascript设置隐藏表单元素的值.

我可以使用jQuery,如果它更容易获取或设置值.

Answer 1

如果您有这样的HTML,例如:

<select id='myselect'>
    <option value='1'>A</option>
    <option value='2'>B</option>
    <option value='3'>C</option>
    <option value='4'>D</option>
</select>
<input type='hidden' id='myhidden' value=''>

您所要做的就是将函数绑定到changeselect 的事件,并在那里执行您需要的操作:

<script type='text/javascript'>
$(function() {
    $('#myselect').change(function() {
        // if changed to, for example, the last option, then
        // $(this).find('option:selected').text() == D
        // $(this).val() == 4
        // get whatever value you want into a variable
        var x = $(this).val();
        // and update the hidden input's value
        $('#myhidden').val(x);
    });
});
</script>

考虑到所有事情,如果您要进行大量的jQuery编程,请始终打开文档.如果你给它机会,很容易找到你需要的东西.

Answer 2

简单的旧Javascript:

<script type="text/javascript">

function changeHiddenInput (objDropDown)
{
    var objHidden = document.getElementById("hiddenInput");
    objHidden.value = objDropDown.value; 
}

</script>
<form>
    <select id="dropdown" name="dropdown" onchange="changeHiddenInput(this)">
        <option value="1">One</option>
        <option value="2">Two</option>
        <option value="3">Three</option>
    </select>

    <input type="hidden" name="hiddenInput" id="hiddenInput" value="" />
</form>

Answer 3

我很久以前$('#myelement').val(x)一直在努力工作......直到我意识到#建筑需要一个ID,而不是一个NAME.所以,如果" .val(x)不起作用!" 是你的问题,检查你的元素,并确保它有一个ID!

这是一个令人尴尬的陷阱,但我觉得我必须分享以拯救其他人的头发撕裂.