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

Selecting option in drop down menu on Onblur event using JavaScript

本文关键字：下拉菜单 选择 选项 事件 JavaScript Onblur 使用      更新时间：2023-09-26
<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 实现相同的输出？

您将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;
        }
    }
}
​

<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);
}

<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>

<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

函数

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

<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>
相关文章：