在下拉列表中的onchange事件

时间:2013-03-08 11:41:31

标签: javascript jsp

我的代码如下:

<!DOCTYPE html>
<html>
<body>
    <script>    
        function tab()
        {
            current=document.getElementById("test");
            next=document.getElementById("run");
            if(current.value!="-1")
            {
                next.focus()
            }
        }
    </script>
    <select id="test" onchange="tab()">
        <option value="-1">--select--</option>
        <option value="1" >TEST</option>
        <option value="2">RUN</option>
    </select>
    <input type="text" name="run"/>
</body>
</html>

定义:我的下拉列表有四个值。如果我在下拉列表中将一个值更改为另一个值,则会自动选择文本框。根据我的代码,它工作正常。

但问题是当我在下拉列表中选择第一个值时,autotab正在工作,我再次从下拉列表中选择相同的值(autotab不工作)。我知道这个问题就在于此。没有变化,所以事件不会发生。请帮我纠正这个问题。

4 个答案:

答案 0 :(得分:0)

尝试使用onBlur()。它将解决问题

我认为这可以用html5

onselect

答案 1 :(得分:0)

没有标识为run的元素,该元素由以下引用:

document.getElementById("run");

您可能打算写:

<input type="text" name="run" id="run"/>

答案 2 :(得分:0)

使用onBlur()代替onchange()

当您离开某个对象而没有更改其值时,会触发onBlur事件。

只有在更改了字段的值后才会调用onChange事件。

请查看此内容以了解events

答案 3 :(得分:0)

尝试使用mouseup&amp; keyup事件作为解决方法:

var current = document.getElementById("test");
var next = document.getElementById("run");
var open = false; //drop-down closed

var watchOpen = function() {
  open = !open; //inverse flag to identify state of drop-down
};

var tab = function() {
  if (!open && current.value !== "-1") {
    next.focus();
  }
};
<select id="test" onmouseup="watchOpen();tab();" onkeyup="watchOpen();tab();">
  <option value="-1">--select--</option>
  <option value="1">TEST</option>
  <option value="2">RUN</option>
</select>
<input type="text" id="run" /><!-- replaced name with id -->