使用javascript在Onblur事件的下拉菜单中选择选项

时间:2012-12-22 05:59:43

标签: javascript html javascript-events

<select id="ddl_example4" name="ddl_example4">
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
<option value="4">item4</option>
<option value="5">item5</option>
<option value="6">item6</option>
</select>

</br>
<textarea rows="4" cols="50" id="tarea" onblur="myFunction()"></textarea>

<script>

function myFunction()
{

var x = document.getElementById("tarea");
iteminput = document.getElementById("ddl_example4");
var v = x.value.substring(5);
alert(v);

function setSelectedIndex(s, v) {
for ( var i = 0; i < s.options.length; i++ ) {
if ( s.options[i].text == v ) {
s.options[i].selected = true;
return;
}
}
}
}    
</script>

在模糊时,我可以在警告框中获取值,但我无法在下拉框中选择相同的值。我从其他网站复制了setselectedindex函数。 请告诉我这里出错的地方

还是有更好的方法可以使用javascript实现相同的输出吗?

谢谢

5 个答案:

答案 0 :(得分:1)

您在setSelectedIndex函数中包含了myFunction函数,但您实际上从未调用它。

试试这个:

function myFunction()
{
    var x = document.getElementById("tarea");
    iteminput = document.getElementById("ddl_example4");
    var v = x.value.substring(5);
    setSelectedIndex(iteminput, v);
}    

function setSelectedIndex(s, v) {
    for ( var i = 0; i < s.options.length; i++ ) {
        if ( s.options[i].text == v ) {
            s.options[i].selected = true;
            return;
        }
    }
}
​

答案 1 :(得分:1)

<select id="ddl_example4" onblur="selectOption()" name="ddl_example4">
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
<option value="4">item4</option>
<option value="5">item5</option>
<option value="6">item6</option>
</select>

/*
You can achieve it using jquery like this


Function selectOption()
{
$("#ddl_example4 option:selected").val();
OR
$("#ddl_example4").val();

*/To selct specific option just set it value......i,e to select "Item5"please use

$("#ddl_example4").val(5);
}

答案 2 :(得分:0)

<select id="ddl_example4" name="ddl_example4">
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
<option value="4">item4</option>
<option value="5">item5</option>
<option value="6">item6</option>
</select>

</br>
<textarea rows="4" cols="50" id="tarea" onblur="myFunction()"></textarea>

<script>

function myFunction()
{

var x = document.getElementById("tarea");
var iteminput = document.getElementById("ddl_example4");
var v = x.value.substring(5);
alert(v);
setSelectedIndex(iteminput, v);
}

function setSelectedIndex(s, v) 
{
    for ( var i = 0; i < s.options.length; i++ ) 
    {
        if ( s.options[i].text == v ) 
        {
            s.options[i].selected = true;
            break;
        }
    }
}


</script>

答案 3 :(得分:0)

<select id="ddl_example4" name="ddl_example4">
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
<option value="4">item4</option>
<option value="5">item5</option>
<option value="6">item6</option>
</select>

</br>
<textarea rows="4" cols="50" id="tarea" onblur="myFunction()"></textarea>

<script>

function myFunction()
{

var x = document.getElementById("tarea");
iteminput = document.getElementById("ddl_example4");
var v = x.value.substring(5);
alert(v);
s= iteminput;
setSelectedIndex(s, v);

}  

function setSelectedIndex(s, v) {
for ( var i = 0; i < s.options.length; i++ ) {
if ( s.options[i].text == v ) {
s.options[i].selected = true;
return;
}
}
}  
</script>

尝试将输入文本框设为'rrrrritem2',然后在下拉列表中选择item2

答案 4 :(得分:0)

功能未正确关闭。请检查以下代码。

<select id="ddl_example4" name="ddl_example4">
<option value="1">item1</option>
<option value="2">item2</option>
<option value="3">item3</option>
<option value="4">item4</option>
<option value="5">item5</option>
<option value="6">item6</option>
</select>

</br>
<textarea rows="4" cols="50" id="tarea" onblur="myFunction()"></textarea>
<script>

    function myFunction()
    {

    var x = document.getElementById("tarea");
    iteminput = document.getElementById("ddl_example4");
    var v = x.value.substring(5);
    alert(v);
    }
    function setSelectedIndex(s, v) {
    for ( var i = 0; i < s.options.length; i++ ) {
    if ( s.options[i].text == v ) {
    s.options[i].selected = true;
    return;
    }
    }
    }   
    </script>