3

onchangeイベントはうまく機能し、入力（テキストボックス）に問題なく入力されますが、onchangeイベントが1つのオプションしかないドロップダウンボックスに適用されると、機能しません。アイテムが1つまたは複数ある場合でも、onchangeを起動するにはどうすればよいですか？

<!DOCTYPE html>

<html>

<head>

<style type="text/css">

</style>

<script type="text/javascript">
function test(x) {

    var x = document.getElementById(x).options[document.getElementById(x).selectedIndex].text

    document.getElementById('output').value = x

}//end of function
</script>

</head>

<body>
<select id="drop1" onchange="test(this.id)">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>
<br><br>
<select id="drop2" onchange="test(this.id)">
  <option value="volvo">Volvo</option>
</select> 
<br><br>
<input type="text" id="output">

</body>

</html>
4

3 に答える 3

6

すべての選択ボックスの上部に空のオプションを追加することも、-Select-とだけ言うオプションを追加することもできます。次に、必要に応じて、空の選択を無視するようにスクリプトを変更します。

于 2013-01-25T21:23:32.260 に答える
2

アイテムが1つしかない場合は、変更されません。onblur代わりに試してください。または、実際onclickに何をしようとしているかによっては、多分。

于 2013-01-25T21:18:51.300 に答える
0

2020年に誰かを助けることができる場合に備えて、この質問に答えています。データベースから単一のデータがある形式にデータを入力するのと同じ問題があり、この方法で解決できました。この例では、イラストにjqueryを使用します。

まず、 .empty（）関数を使用してselect要素を空にする必要があります。

$('#drop2').empty();

次に、 .append（）を使用してselectに空の値を追加します 

$('#drop2').append("<option value='0'>Select</option>");

その後、2つのオプションがあり、1つは空で、もう1つはデータを保持するため、select要素にデータを追加できます。

最後に、成功関数でajaxを使用して、この方法でサーバーからデータを入力します

success:function(response){
                        $('#drop2').empty().append("<option value='0'>Select</option>");
                        response.forEach((item)=>{
                            $('#drop2').append("<option value='"+item[]+"'>"+item[1]</option>");

                        });

矢印関数を使用しました .forEach()

于 2020-01-03T15:45:25.967 に答える