Question

我有这样的输入：

<input name="men" id="men" type="text" size="10" maxlength="2"/>

并选择

<select id="menlist" name="menlist">
  <option value="1">Sausis</option>
  <option value="2">Vasaris</option>
  <option value="3">Kovas</option>
  <option value="4">Balandis</option>
</select>

如何将input id men和select id menlist与javascrip连接？例如：如果用户写入输入字段2 - ＆gt;选择选项值更改为2;

Answer 1

在文本框上，keyup事件调用一个函数，该函数将menlist的选定值设置为键入的值。

<input name="men" id="men" onkeyUp="func1()" type="text" size="10" maxlength="2"/>

function func1()
{
var txtval = parseInt(document.getElementById("men").value);
document.getElementById("menlist").selectedIndex= txtval;
}

Answer 2

<script>
function change_select(val)
{
  document.getElementById('menlist').selectedIndex = val;
}
</script>

Answer 3

从你的问题不清楚是否可以使用jQuery。如果是，那么你可以做

$(function(){
    $("#men").keyup(function(){
        var value=$(this).val();
        $("#menlist option[selected]").removeAttr("selected");
        $("#menlist option[value=" + value + "]").attr("selected", "selected");
    });
    $("#menlist").change(function(){
        $("#men").val($(this).val());
    });
});

这是jsFiddle

通过这种方式，您可以按任何顺序获得选项的任何值。只要确保它们是独一无二的。例如，您可以在选择中对名称进行排序。

UPDATE 添加了一个处理程序，可在选择更改时更改输入值。

如何连接输入和选择选项？

3 个答案: