2011-09-09 12 views
1

このチェックボックスは、フォームの送信ボタンを有効/無効にしています。ボタンが無効になっていることを確認してからHTMLをオンにするOnclick

は、私は単にそれを有効化/無効化のために、このコードを持って

今、私はちょうどそれが無効になっていたとき、彼らはボタンをクリックした場合ように、私は、それを作ることができ、それは特定のでそれらを警告しているどのように思ったんだけど
onclick="if(this.checked){this.form.submit_btn.disabled=false}else{this.form.submit_btn.disabled=true};this.blur();" 

メッセージ。

ので、ボタンにonclickのイベントを追加し、それが

if(this.disabled=true){alert('Button disabled!');} 

か何か似たようなものがありますか?私はすべてのonclickのものにかなり新しいです。

おかげ

+1

私はこれが特に必要だとは思わない - などとして見えるようにブラウザスタイル無効のボタンを、ボタンがクリックされたときに何もアクションが(スタイリングが適用される「ダウンボタン」または)取られないよう見て、あなたドンユーザーにボタンが無効であることを伝える別の通知が必要です。 – Bojangles

+0

ボタンが無効になっているときにonClickは機能しません。これはボタンの無効化のポイントです。代わりに、範囲を受け入れるためのスパンまたはdivの上にメッセージを表示するには、チェックボックス – Parvesh

+0

をクリックしてください.JSではあまり良くありません。しかし、JQueryでは、マウス/ホバーなどの操作をすることができますチェックボックスを埋める必要があることをユーザーに示します。 OnClickコマンドとは違ってクリックイベントを追加することもできるはずです:) –

答えて

8

は何が価値があるか分からないのですが、jQueryのでは、それは次のように行くだろう。しかしポイントが表示されない場合

// Not tested!  
$(document).ready(function(){ 
    $('#myButton').click(function(){ 
    if($(this).is(':disabled')) { 
     alert('No need to click, it\'s disabled.'); 
    } 
    }); 
}); 

。ボタンが既に無効になっている間に(そしてブラウザにそういったメッセージが表示されている)、誰かにメッセージを耳にします。

+0

私はメッセージが必要な理由は、ボタンがイメージでスタイルされているため、ボタンが無効になってもイメージが変化しないため、ユーザーはボタンが無効かどうかを知る方法がなく、彼らはそれをクリックして何もしないときにウェブサイトで。 –

+0

背景画像を何らかの画像に変更してメッセージを表示する代わりにボタンをクリックできないことを示すJavascript(またはjQueryを使用する)を使用しないのはなぜですか? –

+0

提案に感謝します! :)私はその代わりにそれをやり終えた:) –

3

あなたは少なくとも、とにかく直接はできません。ボタンが無効になっていると、無効になり、イベントも発生しません。

今、あなたが絶対にする必要があれば、それを丸める方法があります。

基本的に、あなたはそれが2つのdivなどのようなボタンを使用して動作させることができます。

<div> 
     <div id="overlay" style="display:hidden; z-order:99999">&nbsp;</div> 
     <button id="mybtn">My Button to click</button> 
    </div> 

あなたが透明にオーバーレイのdivの背景色を設定し、ボタンを無効にすると、あなたはオーバーレイdiv要素を再表示。

divは透明なので、ボタンにNOの変更が表示されますが、クリックすると透明なdivが最初にクリックされるようになります。

次に、クリックハンドラをオーバーレイdivに添付すると、無効なボタンをクリックすると表示される(実際にはそうではない)メッセージがトリガされます。

+0

誰も私に-2をくれました、あなたの理由を知りたいのですが?それは公正だ... – shawty

+0

なぜ私は誰か-1あなたを知りません:私はあなたに+1を与えました: –

+0

良い説明。おかげで –

0

代わりにグレースケールのアプローチでイメージスタイルを変更することができます。

img { 
    filter: gray; /* IE6-9 */ 
    filter: grayscale(1); /* Firefox 35+ */ 
    -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */ 
} 
関連する問題