チェックボックスでフォーム送信ボタンを表示/非表示にする-jQuery

目次

友人に教えてもらったスパム対策の方法。お問い合わせフォームのチェックボックスにチェックを入れないと送信ボタンを表示しないスクリプトのメモ。

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript">
$(function(){
$('#btn').hide();
$("#switch").click(function(){
$("#btn").slideToggle(this.checked);
$("form").attr("action","/apps/mailform/send.cgi");
});
});
</script>
<form action="#" method="post">
<label>
<input id="switch" type="checkbox" name="ボタン表示(必須)" value="表示" />
ボタンを表示</label>
<input id="btn" type="submit" value="送信" />
</form>

 

↓実際にチェック入れたら送信ボタンが右に表示されます。

 

チェックボックスにチェックが入っていないとaction="#"となっていて、チェックを入れるとaction属性lib/send.cgiに変わるようになっています。自動でフォーム送信するようなボットを使ったスパムに対して有効かもしれません。

参考サイト

前へ

jQueryのslideToggleを使ったアコーディオンメニューのメモ

次へ

IE9以上でMovableTypeの管理画面が動かないときの対処