1

あなたの助けが必要です。

以下のコードは、入力ボックスに入力された後に単一の値が選択ボックスに追加された場合 (したがって、編集可能な選択ボックスになっている場合) にうまく機能し、別の値が入力ボックス、選択ボックスの内容が新しく入力された値に変更されます。

以下のコードを変更して、追加の入力値を選択ボックスに追加できるようにしたいと思います。

<html> 

<style> 

#list { 
    left: expression(this.previousSibling.offsetLeft); 
    width: expression(this.previousSibling.offsetWidth);  
    clip: expression("rect(2px auto 20px " + (this.previousSibling.offsetWidth - 20) + "px)"); 
    overflow: hidden;
    position: absolute;
    top: -1px;
    font-size: 9pt;
    font-family: Arial;
}
#wrapper {
    border: 1px solid blue;
    display: block;
    position: relative;
    width: 180px;
    height: 20px;
}
#text1 {
    border: 0;
    height: 18px;
    width: 180px;
    position: relative;
    font-size: 9pt;
    font-family: Arial;
    padding: 2px;
}
</style> 

<script language="javascript"> 
function getval() {
var select = document.getElementById('list')

    document.getElementById('text1').value = select.options[select.selectedIndex].text

}//end of function

var oNewOption = null;

function AddListItem(oInput) {

var oSelect = oInput.nextSibling;

if (oNewOption == null) {
oNewOption = document.createElement("OPTION");
oSelect.options.add(oNewOption);
}

oNewOption.text = oInput.value;
oNewOption.value = oInput.value;

}

</script> 
<body> 

<div id="wrapper">
<input id="text1" type="text" onkeyup="AddListItem(this)"><select id="list" onchange="getval()"> 
</select>
</div>

</body> 
</html>
4

1 に答える 1