mailtoをちょっとだけユーザーフレンドリーにするJavaScript「jQuery Confirm mailto」

お問い合わせのフォームを作るまでもないなーという場合、mailtoで済ませてしまうことも多いかと思います。
でも、ユーザーにとっては、メーラーがいきなり立ち上がるのも不安になりますよね。
そんな時はjQuery Confirm Mailtoを利用して、いったんダイアログを挟んでみましょう。
mailtoをちょっとだけユーザーフレンドリーにするJavaScript「jQuery Confirm mailto」サンプル

使用方法
jQuery Confirm Mailtoからファイル一式をダウンロード。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="/test/js/confirm.js"></script>
<script>
$(document).ready(function(){
$('.class名').confirmMailto();
});
</script>

基本はこれだけ。
あとはmailtoにしたリンクにclassを振れば完成です。
<a href="mailto:***@aa.a" class="class名"></a>
これだけだと英語のダイアログになってしまうので、jsを直で変更するか下記のオプションを利用します。
$(document).ready(function(){
$('.class名').confirmMailto({
message: '$to にメーラーで送ってもいいですか? ', //$toには下記で設定したアドレスあるいはテキストが入ります。
to: 'href', //hrefであればメール、htmlであればテキストが入ります
success: function(){
$('.class名').css('color','#3C3'); //成功時の色の変更
},
fail: function(){
$('.class名').css('color','#F66'); //非送信時の色の変更
},
callback: function(result){
if(result){
alert('メール送信ありがとうございます!'); //成功時のメッセージ
}else{
alert('え、送らないの・・・?'); //非送信時のメッセージ
}
}
});
});

mailtoをちょっとだけユーザーフレンドリーにするJavaScript「jQuery Confirm mailto」サンプル

sponsors

「mailtoをちょっとだけユーザーフレンドリーにするJavaScript「jQuery Confirm mailto」」をシェアする

記事作成:
記事URL:

TOP > > > mailtoをちょっとだけユーザーフレンドリーにするJavaScript「jQuery Confirm mailto」