ラジオボタンコントロールとjqueryを使用してリンク設定を制御する
-
05-07-2019 - |
質問
特定のCSSクラスを持つリンクの場合、ラジオのグループからのユーザーの選択に基づいて、リンクが同じウィンドウで開くか、新しいウィンドウで開くか、ポップアップ(onclickを使用)で開くかを制御したいボタン-そして、その選択をクッキーに保存します(すべてjQueryを使用)。誰もこれを達成する方法を知っていますか?
解決
これはおそらく私がやる方法です...(が必要です) jQuery cookieプラグイン):
<script language="javascript">
$(function() {
if($.cookie('link_pref')) {
var link_pref = $.cookie('link_pref');
$('#link_options_form :radio[value="'+ link_pref+'"]')
.attr('checked','checked');
}
$.cookie('link_pref',$('#link_options_form :radio:checked').val(), {expires: 0});
$('#link_options_form :radio').unbind('click').bind('click',function() {
$.cookie('link_pref', $(this).val(), {expires: 0});
});
$('a').unbind('click').bind('click',function() {
var link_pref = $.cookie('link_pref');
var href = $(this).attr('href');
var link_txt = $(this).text();
switch(link_pref) {
case 'new':
$(this).attr('target','_blank');
return true;
case 'pop':
window.open(href,link_txt,'width=640,height=480,toolbar=yes,location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes');
return false;
case 'greybox':
// Other options found here:
// http://orangoo.com/labs/greybox/advance_usage.html
GB_show(link_txt, href);
return false;
default:
$(this).attr('target','_self');
return true;
}
});
});
</script>
<form id="link_options_form">
<label><input type="radio" name="link_options" value="same" /> Open in Same Window</label>
<label><input type="radio" name="link_options" value="new" /> Open in New Window</label>
<label><input type="radio" name="link_options" value="pop" /> Open in Pop-Up Window</label>
<label><input type="radio" name="link_options" value="greybox" /> Open in Greybox</label>
</form>
編集:最初にテストしなかったのは残念です。私はそこにいくつかのタイプミスがあり、クッキーを設定するのを忘れていました(ごめん)。私はそれをテストしましたが、今ではあなたのHTMLで動作します。上記の新しく編集したコードを使用します。 ;-)
編集2:何らかの理由で正しいプラグインを使用していない場合に備えて、Cookieプラグインへの直接リンクを追加しました。
編集3:個人的には、javascriptでラジオボタンをオンに設定しません。サーバー側の言語で同じCookieにアクセスできると思います。しかし、新しく編集したコードで機能する方法を提供しました。
編集4:チェックされたラジオボタンのバグの初期設定が修正されました。今回は本当にうまくいくはずです。実際に。 o_0
所属していません StackOverflow