人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

Javascriptに関する質問です。
FormのSubmitボタンの「disabled」を、Checkboxの有無で切り替えたいと考えております。
試しにちょこちょこ作ってみたのですが、何か基本的な部分でつまずいているような気がしております。
ご存知の方おられましたら、コメントお願い致します。


<script Language="JavaScript"><!--
function setBT(cOBJ,fName) {
document.fName.disabled = !cOBJ.checked;
}
// --></script>

<form name="test" method="post" action="index.html">
<input type="checkbox" name="agree" value="同意" onClick="setBT(this,'BTN')" />同意
<input type="image" name="BTN" src="btn.gif" alt="OK" disabled>
</form>

●質問者: lg-tsp
●カテゴリ:コンピュータ インターネット
✍キーワード:Disabled JavaScript コメント ボタン 作ってみた
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● ElekiBrain
●50ポイント

http://q.hatena.ne.jp/1155032562(ダミーURL)

たぶんこんな感じだとは思うのですが。nameにせずidにし、getElementByIdにて取得。一応テストはしてみましたが。

<script Language="JavaScript">

<!--

function setBT(cOBJ,fName) {

document.getElementById(fName).disabled = !cOBJ.checked;

}

// -->

</script>

</head>


<body>

<form name="test" method="post" action="index.html">

<input type="checkbox" name="agree" value="同意" onClick="setBT(this,'BTN')" />同意

<input id="BTN" type="image" src="btn.gif" alt="OK" disabled>

</form>

</body>

◎質問者からの返答

ご回答ありがとうございます。

頂いたサンプルで実装できました。

ありがとうございます


2 ● KirakiraHikaru
●10ポイント

onClick="setBT(this,'BTN')"

で'BTN'の文字列を渡しているので、

そのままだとBTNオブジェクトにはアクセスできません。


JavaScriptを下記のようにすると、

指定された文字列のオブジェクトにアクセスできます。

function setBT(cOBJ,fName) {
document.getElementById(fName).disabled = !cOBJ.checked;
}

http://sonic64.com/2003-08-29.html


また、ほかのボタンから利用する可能性がなければ固定でも良いと思います。

function setBT() {
document.all.BTN.disabled = !document.all.agree.checked;
}

3 ● shoki0311
●20ポイント

「input type="image"」ではdisabled属性を使用できないようです。(参考:上から10行目あたり)

やはり「input type="submit"」を使ってはどうでしょうか?

それと、JavaScriptも少しおかしかったので直してみました。

-------------------------------------------------

<script Language="JavaScript"><!--
function setBT () { // 引数は不要になったので削除
rs=document.test.BTN.disabled; // ボタンが無効状態になっているかを取得
rs=document.test.BTN.disabled;
// フォーム名↑ ↑要素名
if (rs) document.test.BTN.disabled = false; // 有効なら無効化
else document.test.BTN.disabled = true; // 無効なら有効化
}
// --></script>

<form name="test" method="post" action="index.html">
<input type="checkbox" name="agree" value="同意" onClick="setBT()" />同意
<!-- ↑引数は不要になったため削除 -->
<input type="submit" name="BTN" value="送信" alt="OK" disabled>
<!-- ↑src属性は削除 そしてvalue属性を追加 -->

-------------------------------------------------

これでちゃんと動きます。

◎質問者からの返答

このような実装もありなのですね。

勉強になります。

ご回答ありがとうございました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ