プロが教えるわが家の防犯対策術！

コンボボックスへの入力に関して

解決済

  • 質問者：SANA_999
  • 質問日時：
  • 回答数：2件

教えて下さい。

selectのコンボボックスを使用して、プルダウンを作成したいと考えて
いますが、そのコンボボックスを手入力も可能としたいと考えて
います。

何か良い方法はないでしょうか？？？

サンプル的なものを教えて頂けれ幸いです。

よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (2件)

No.1

  • 回答者： askaaska
  • 回答日時：

HTMLのコンボボックスは


入力できないわ。
<input type="text">と<select>を
上手に組み合わせるしかないわね。
    • good
    • 0
    • 件
通報する

No.2ベストアンサー

  • 回答者： fujillin
  • 回答日時：

どのようなインターフェースにするのかをきちんと決めておかないと、操作しにくいものになりそう…



ご参考まで。（細かいところはいい加減）
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head><title>test</title>
<style type="text/css">
select, input { width:8em; }
</style>

<script type="text/javascript">
<!--
function test(evt) {
var i, tp = evt.type, t = evt.target || evt.srcElement;
var pair = document.getElementsByTagName(tp === 'blur'?'SELECT':'INPUT');
for (i=0; i<pair.length; i++) if (pair[i].name == t.name) break;
pair = i<pair.length?pair[i]:null;
if (tp === 'change') {
if (pair) pair.value = t.value;
} else if (tp === 'keydown') {
var c =evt.keyCode;
if (pair && (c != 9 && c != 13 && c != 38 && c != 40)) {
t.style.display = 'none';
pair.style.display = 'inline';
pair.focus();
}
} else if (tp === 'blur') {
if (t.value) {
pair.options.length = 4;
pair.options[4] = new Option(t.value, t.value);
pair.options[4].selected = true;
}
t.style.display = 'none';
pair.style.display = 'inline';
}
}
-->
</script>
</head>

<body>
<select name="sel1" onchange="test(event)" onkeydown="test(event)">
<option value="" selected>
<option value="v1">v1
<option value="v2">v2
<option value="v3">v3
</select>
<input type="text" name="sel1" value="" onblur="test(event)" style="display:none;">
</body>
</html>
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報