Javascript 如何将onblur和onfocus添加到由选择框确定其值的输入框中_Javascript_Html

Javascript 如何将onblur和onfocus添加到由选择框确定其值的输入框中

javascript html

Javascript 如何将onblur和onfocus添加到由选择框确定其值的输入框中,javascript,html,Javascript,Html,我试图使它，使您可以点击使一个值消失，并从一个文本框中重新出现，这很简单，但文本框的值是由选择框中选择的内容决定的下面是javascript： function changeValue(){ var option=document.getElementById('filter').value; if(option=="1"){ document.getElementById('field').value="Option 1"; }

我试图使它，使您可以点击使一个值消失，并从一个文本框中重新出现，这很简单，但文本框的值是由选择框中选择的内容决定的

下面是javascript：

function changeValue(){
    var option=document.getElementById('filter').value;

    if(option=="1"){
            document.getElementById('field').value="Option 1";
    }
        else if(option=="2"){
            document.getElementById('field').value="Option 2";
        }

        else if(option=="3"){
            document.getElementById('field').value="Option 3";
        }

}

以下是HTML：

<input class="input" type ='text' name="key" id ="field" value ="Option 1" />
<select name="filter" id="filter" onchange="changeValue();">
<option id="1" value="1">Option 1</option>
<option id="2" value="2">Option 2</option>
<option id="3" value="3">Option 3</option>
</select>

我面临的问题是，一旦单击输入框，它就会转到数字1值，而不是返回其javascript确定的值。非常感谢您对此提供的任何帮助。

在js文件的开头为全局变量x设置一个值，在每个实例中为该变量设置一个值

var x = 0;

function changeValue(){
var option=document.getElementById('filter').value;

if(option=="1"){
        document.getElementById('field').value="Option 1";
        x = 'option 1';
}
    else if(option=="2"){
        document.getElementById('field').value="Option 2";
        x = 'option 2';
    }

    else if(option=="3"){
        document.getElementById('field').value="Option 3";
        x = 'option 3';
    }

}

创建一个名为onblur的新函数

function inputOnBlur() {
    document.getElementById('field').value = x;
}

html

希望这有帮助

这对我来说很有效，看看下面的代码和演示，可能是您没有将脚本包含在脚本标记中

<html>   
   <head>
        <script>
            function changeValue(){
            var option=document.getElementById('filter').value;

            if(option=="1"){
                    document.getElementById('field').value="Option 1";
            }
                else if(option=="2"){
                    document.getElementById('field').value="Option 2";
                }

                else if(option=="3"){
                    document.getElementById('field').value="Option 3";
                }

             }
           </script>
   </head>
   <body>

      <input class="input" type ='text' name="key" id ="field" value ="Option 1" />
      <select name="filter" id="filter" onchange="changeValue();">
        <option id="1" value="1">Option 1</option>
        <option id="2" value="2">Option 2</option>
        <option id="3" value="3">Option 3</option>
     </select>
  </body>
</html>

请澄清你的意思，而不是说回来

function inputOnFocus() {
     document.getElementById('field').value = '';
}

<html>   
   <head>
        <script>
            function changeValue(){
            var option=document.getElementById('filter').value;

            if(option=="1"){
                    document.getElementById('field').value="Option 1";
            }
                else if(option=="2"){
                    document.getElementById('field').value="Option 2";
                }

                else if(option=="3"){
                    document.getElementById('field').value="Option 3";
                }

             }
           </script>
   </head>
   <body>

      <input class="input" type ='text' name="key" id ="field" value ="Option 1" />
      <select name="filter" id="filter" onchange="changeValue();">
        <option id="1" value="1">Option 1</option>
        <option id="2" value="2">Option 2</option>
        <option id="3" value="3">Option 3</option>
     </select>
  </body>
</html>