• ベストアンサー

disableとすることなく、ユーザによる変更操作をjavascriptで無効化する方法を教えて下さい。

<selectタグで作ったプルダウンメニューと、 <input type="checkbox"で作ったチェックボックスとについて教えて下さい。 何れも、disableとすると表示色が変わり、 しかも、プルダウンメニューの方は <formを介して送信されるvalueが正常ではない場合があるようです。 そこで、プルダウンメニューとチェックボックスとの何れも、 disableとすることなく、ユーザによる変更操作をjavascriptで無効化したいのですが、やり方が分かりません。 ご存じの方、どうかよろしくお願い致します。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

変更させたくない・・・というだけならこんな処理で? <input type="checkbox" onFocus="chk=this.checked" onChange="this.checked=chk"> <select onFocus="idx=this.selectedIndex" onChange="this.selectedIndex=idx"> <option value="">0</option> <option value="1">1</option> <option value="2" selected>2</option> <option value="3">3</option> </select>

tfj3116
質問者

お礼

oka5130様、yambejp様 早速教えて頂いたにもかかわらず、 お礼と返信が大変遅れ、申し訳ありません。 お二人に教えて頂いた対処の方法については、 双方試み、大変勉強になりました。 おかげさまで、これらの対処の方法を使い分けることで、 本件は解決致しました。 本当にありがとうございます。 今後ともどうかよろしくお願い致します。

その他の回答 (1)

  • oka5130
  • ベストアンサー率66% (35/53)
回答No.1

JavaScriptで無効化する方法はちょっと思いつかないのですが、 もし出来たとしても、disableを指定していないのに操作できないのは ユーザーにとって使いにくい(なぜ変更できないかわからない) フォームになってしまうので、次のような方法をオススメします。 【もともとのフォーム(disabledを指定するとデータが送信されない)】 <select name="select1" disabled> <option value="1" selected>1</option> <option value="2">2</option> </select> <input type="checkbox" name="check1" disabled>1 <input type="checkbox" name="check2" checked disabled>2 【修正案】 <select name="select1_dummy" disabled> <option value="1" selected>1</option> <option value="2">2</option> </select> <input type="checkbox" name="check1_dummy" value="1" disabled>1 <input type="checkbox" name="check2_dummy" value="1" checked disabled>2 <!-- hiddenで渡す --> <input type="hidden" name="select1" value="1"> <input type="hidden" name="check2" value="1">

関連するQ&A

  • javascriptでチェックボックスの選択状況をチェックする方法につ

    javascriptでチェックボックスの選択状況をチェックする方法について質問です。 チェックボックスを <input type="checkbox" name="chk[]" value="1"> <input type="checkbox" name="chk[]" value="2"> のようにした場合、チェックボックスが1か所以上選択されているかどうかは、 var count = 0; for (var i=0;i<document.myform.elements['chk[]'].length;i++){ if(document.myform.elements['chk[]'][i].checked){ count++; } } if(count==0){ window.alert("チェックしてください!"); } のようにすればチェック可能ですが、inputタグで <input type="checkbox" name="chk1[]" value="1"> <input type="checkbox" name="chk1[]" value="2"> <input type="checkbox" name="chk2[]" value="A"> <input type="checkbox" name="chk2[]" value="B"> のように「name」の配列名が変化する場合はどのようにすればチェック可能でしょうか?

  • リクエストパラメータの値によってJavaScriptでスタイルを変更する場合

    いつも参考にさせて頂いてます。 早速なのですが以下のことが分からず困っています。 親画面から子画面へ遷移する。 その際、チェックボックスの値を複数個POSTで送信する。 子画面で受け取った値をhiddenにそのまま保持し、 孫画面にそのままPOSTで送信する。 JSPを使っているのですがこういったことは可能なのでしょうか? ■親画面 <form method="POST" name="data2" action="child.jsp">   <input type="checkbox" id="check" name="check" value="1>   <input type="checkbox" id="check" name="check" value="2">   <input type="checkbox" id="check" name="check" value="3">   <input type="submit" value="送信"> </form> ■子画面 window.onload = function(){   //画面遷移時にリクエストパラメータをhiddenにセット   document.data.check2.value = <%= request.getParameterValues("check") %>; } ~略~ <form method="POST" name="data2" action="grandchild.jsp">   <input type="hidden" id="check2" name="check2" value="">   <input type="submit" value="送信"> </form> こんな感じで孫画面へそのまま渡せるのかな?と思ったのですが うまく行きませんでした。 アドバイスなどありましたら宜しくお願いします。

  • 一つのformで、複数のaction指定

    レイアウトなどの関係で、formの配置が基本とは異なるものになってしまい、うまく動作させる方法が見つからず困っています。 現在は <form> <input type="checkbox" name="select[]" value="●●"> <input type="checkbox" name="select[]" value="●●"> <input type="checkbox" name="select[]" value="●●"> </form> …… <form method="POST" action="A.php"> <input type="submit" name="aa" value="あああ"> </form> <form method="POST" action="B.php"> <input type="submit" name="bb" value="いいい"> </form> <form method="POST" action="C.php"> <input type="submit" name="cc" value="ううう"> </form> <form method="POST" action="D.php"> <input type="submit" name="dd" value="えええ"> </form> のようになっていて、チェックボックスの値を送信したいのは、Dのボタンを押したときだけPOSTされるようにしたい状態です。 この値を取得する方法か、もしくは <form method="POST" action="(ボタンに応じたもの)"> <input type="checkbox" name="select[]" value="●●"> <input type="checkbox" name="select[]" value="●●"> <input type="checkbox" name="select[]" value="●●"> …… <input type="submit" name="aa" value="あああ"> <input type="submit" name="bb" value="いいい"> <input type="submit" name="cc" value="ううう"> <input type="submit" name="dd" value="えええ"> </form> このように、一つのフォームの中に埋めてしまい、actionに入る値をボタンによって分ける方法はありませんでしょうか? もしくは他の方法でも構いません。 お分かりの方がいましたら、是非ご教授お願いいたします。

    • 締切済み
    • PHP
  • javascriptでプルダウンメニューの操作

    javascriptで、select/optionタグからなるプルダウンメニューから、マウスが外れたらプルダウンメニューが閉じるという動きを実装したいです。 select/optionからマウスアウトした際に、別のフォームにフォーカスを合わせる(これで無理やりプルダウンを閉じた状態にする)処理を書いているのですが、 これだと、optionから次のoptionタグにマウスが移動したときもマウスアウトと判定されてしまい、プルダウンの中身を選択する前にメニューが閉じてしまいます。 このあたりの問題をうまく解消できる描き方などありましたら教えて下さい。

  • チェックボックスで指定したものをダウンロード

    JavaScriptの初心者です。 画像一枚毎にチェックボックスを作って、チェックした画像がダウンロードボタンをクリックすると保存されるようなHPを作りたいのですが、いろいろ調べているのですがどのようにすればよいのか見当がつきません。どうかご存じの方よろしくお願いします。 イメージは、フォトギャラリーのサムネイル画像の下にチェックボックスがあってチェックした画像のみダウンロードするという感じです。 CGIを使わずにできるかどうかも合わせてご教示いただけたらと思います。 <FORM NAME="form1"> <INPUT TYPE="checkbox" VALUE="1"> 画像(1) <INPUT TYPE="checkbox" VALUE="2"> 画像(2) <INPUT TYPE="checkbox" VALUE="3"> 画像(3) <INPUT TYPE="checkbox" VALUE="4"> 画像(4) <INPUT TYPE="checkbox" VALUE="5"> 画像(5)<BR> <INPUT TYPE="button" onClick="BoxChecked(true);" VALUE="ダウンロード"> </FORM>

  • JavaScriptでcheckboxの入力個数制限

    以下のようなチェックボックスがあります。 3つ以上チェックできないようにしたいのですが、JavaScriptで可能でしょうか? <FORM method=POST action="aaa.cgi" name="FORM1"> <input type="checkbox" name="Q1" value="1">1<br> <input type="checkbox" name="Q2" value="1">2<br> <input type="checkbox" name="Q3" value="1">3<br> <input type="checkbox" name="Q4" value="1">4<br> <input type="checkbox" name="Q5" value="1">5<br> </form>

  • チェックボックスの値を(1,0)のようにすべて送信する方法

    formをsubmitすると、チェックボックスの値は、 チェックされた項目のvalue値が配列の形で送信されますよね。 たとえば、 <INPUT TYPE="CHECKBOX" NAME="C_BOX" VALUE="111" CHECKED> <INPUT TYPE="CHECKBOX" NAME="C_BOX" VALUE="222" CHECKED> <INPUT TYPE="CHECKBOX" NAME="C_BOX" VALUE="333" CHECKED> <INPUT TYPE="CHECKBOX" NAME="C_BOX" VALUE="444"> <INPUT TYPE="CHECKBOX" NAME="C_BOX" VALUE="555" CHECKED> だと、 [111,222,333,555] のように。 今回は、表形式でデータを表示し、 チェックされた行の、他の列の値(フィールド)も取得したいのです。 他の列のフィールドは、チェックされていない行でも入力されている可能性があります。 そうすると、そのフィールドの値も配列にして送ってしまうと、 チェックボックスの値と数が合わなくなり、横方向での関連付けが出来なくなってしまいます。 なので、チェックボックスの送信値を、配列の要素数は全件で、 チェックされたかされていないかということが分かるように することは不可能でしょうか? JavaScriptは規約により、使うことが出来ない状況で困っています(><) 何か案があれば教えてください。

    • ベストアンサー
    • HTML
  • チェックに応じて違うチェックボックスをアクティブにしたい

    次のHTMLのように、大分類、小分類のような構成のチェックボックス グループがあります(初期設定は全部チェック無しです) 普段は[a][b][c][d]をdisableとしておき、(1) にチェックが入った 場合に[d]以外([a][b][c])アクティブ(?とにかくチェックを入れる ことができる)ようにするにはどうしたらいいでしょうか。 よろしくお願い致します。 <form id="Form1"> : <INPUT TYPE="CHECKBOX" NAME="food" value="果物">(1) 果物 <INPUT TYPE="CHECKBOX" NAME="food" value="野菜">(2) 野菜 <INPUT TYPE="CHECKBOX" NAME="food" value="肉魚">(3) 肉魚 <br> <INPUT TYPE="CHECKBOX" NAME="fruit" value="りんご">[a] りんご <INPUT TYPE="CHECKBOX" NAME="fruit" value="みかん">[b] みかん <INPUT TYPE="CHECKBOX" NAME="fruit" value="ぶどう">[c] ぶどう <INPUT TYPE="CHECKBOX" NAME="fruit" value="バナナ">[d] バナナ : </form>

  • チェックボックスの全選択

    <input type="checkbox" name="chk" value=1> <input type="checkbox" name="chk" value=2> <input type="checkbox" name="chk" value=3> <input type="checkbox" name="chk" value=4> <input type="checkbox" name="chk" value=5> このように同一名称のチェックボックスに対して ボタンを押下された時全てのチェックボックスを チェックするJavaScriptの 書き方を教えて貰えないでしょうか

  • formの外にあるチェックボックスをPost送信?

    こんにちは! HTMLのソース上、または、ページのレイアウト上、一つの<form>タグの外に 配置しざるを得ない<input>要素がある場合があると思います(?) 例えば、添付画像のように、一括操作用のプルダウンメニューと送信ボタンを置いた Formタグがあり、また、それとは離れた場所にチェックボックスがあるようなケースです。 添付画像は今、勉強用に作成している自作ブログの管理画面なのですが、 記事一覧の左端に並ぶチェックボックスのうち、チェックされた記事を、 上部にある一括操作メニューから一括削除出来る様にしたいと考えています。 そこで、今、つまづいているのが、どのようにして、チェックされた該当の、 各記事IDをPostすることが出来るのかということです。 <form>と</form>の間に挟まれていない、input項目(この場合はチェックボックス)は、 Postしても送信されないと思うのですが、どのように対処するのが宜しいのでしょうか? javascriptでチェックされた記事のIDを、<form>タグの間に、 <input type="hidden">で、それぞれ、挿入されていくように 実装するという方法は頭に浮かんでいるのですが、 このやり方がベストプラクティスとなりますでしょうか? 経験豊富な先輩方のお知恵を拝借出来ればと思い、 ご質問させて頂きました。 宜しければご返答頂ければ幸いです。 よろしくお願い致しますm(_ _)m

    • ベストアンサー
    • PHP

専門家に質問してみよう