チェックボックスのvalueを、テキストボックスに挿入したい

解決済

質問者：litton101
質問日時：2005/11/14 10:33
回答数：1件

文末のように、４つのチェックボックスと１つのテキストボックスがあります。

(1) チェックボックスのチェックに伴い各チェックボックスのvalueを
そのままテキストボックスの方に転記したいです。

(2) 逆に、チェックが外れたら、該当する valueをクリアしたいです。

(3) 鉄道～航空の一つ以上にチェックが入っている間、テキストボックス自体
をreadonlyにし、手動でいじれなくしたいです。
逆に、全てのチェックが解除されている間は、自由記述可能です。

(4) チェックする前に何らかの値が入っていたら、それらは強制クリアして、
valueの方を優先したいです。

イメージとして、「鉄道」と「航空」にチェックが入ったら、テキストボックスの値は
「新幹線　在来線　ヘリコプタ　ジャンボ　」となります。
現在、テキストボックスはReadOnlyです。

そして「鉄道」の方だけチェックが解除されたら、テキストボックスの値は
「ヘリコプタ　ジャンボ　」となります。テキストボックスは、まだReadOnlyです。

さらに「航空」のチェックも解除されたら、テキストボックスの値は
空白「」となります。テキストボックスのReadOnlyも解除されます。

<html>
<head>
</head>
<body>
<form method="post" action="samp.php" id="query" name="query">
<input type="checkbox" class="norimono" name="norimono[]" value="新幹線　在来線　">鉄道
<input type="checkbox" class="norimono" name="norimono[]" value="軽　セダン　クーペ　">四輪車
<input type="checkbox" class="norimono" name="norimono[]" value="小型　中型　大型　">二輪車
<input type="checkbox" class="norimono" name="norimono[]" value="ヘリコプタ　ジャンボ　">航空
<input value="" size="50" type="text" name="keyword">
</form>
</body>
</html>

通報する

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

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： yambejp
回答日時：2005/11/14 12:27

さいきんがんばってるみたいですから

わからないはずないと思うんですけどねぇ・・・

<html>
<head>
<script language="javascript">
function check(f){
f.keyword.value="";
for (var i=0; i<f.length;i++){
if(f[i].className=="norimono" && f[i].checked==true){
f.keyword.value += f[i].value;
}
}
f.keyword.readOnly=(f.keyword.value!="");
}
</script>
</head>
<body>
<form method="post" action="samp.php" id="query" name="query">
<input type="checkbox" class="norimono" name="norimono[]" onClick="check(this.form)" value="新幹線　在来線　">鉄道
<input type="checkbox" class="norimono" name="norimono[]" onClick="check(this.form)" value="軽　セダン　クーペ　">四輪車
<input type="checkbox" class="norimono" name="norimono[]" onClick="check(this.form)" value="小型　中型　大型　">二輪車
<input type="checkbox" class="norimono" name="norimono[]" onClick="check(this.form)" value="ヘリコプタ　ジャンボ　">航空
<input value="" size="50" type="text" name="keyword">
</form>
</body>
</html>

- 0
- 件

通報する

この回答へのお礼

yamabejpさん、いつもお世話になっております。
動作の方も完璧で、早速組み込ませていただきました。
ありがとうございました。

> さいきんがんばってるみたいですから
> わからないはずないと思うんですけどねぇ・・・

す、すみませんm(_ _;)m

最近ご教示いただいた分については、
いろいろ応用させていただきつつ、
活用はしているのですが、
ちょっと見慣れぬ要素が絡んでくると
すぐに頭がこんがらがってしまいます・・・

基礎的な勉強があまりにも不足して、お恥ずかしい限りです。