- 締切済み
jQueryでCookieがあるか判別する方法。
現在ホームページを制作している初心者です。 jQueryでCookieがあるか判別する方法を教えて下さい。 formの入力欄に背景画像を使用しています。 現在jQuery内に記述している内容↓ $('id名') .focus(function() { $(this).css("background", "#fff") }) .blur(function() { if ($(this)[0].value == '') { $(this).css("background", "url(画像名.png) left top no-repeat") } }); 今現在は、 非focus時は画像が表示、 focus時は背景白、 テキスト入力後非focus時は背景白、 という状態で理想どうりなのですが 一度ページを出て、もう一度同じページに入ると 前回入力したものと画像が同時に出力されていて とても見づらい状態です。 jQueryでCookieが残ってない時は画像を表示するという記述をしたいのですが わかりません。 どなたか教えていただけないでしょうか？ ちなみに上記のjQueryの記述は、参考サイトでコピペしたものですので 意味は分かってません。
- JavaScript
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- yyr446
- ベストアンサー率65% (870/1330)
Cookieの有無は関係無いと思うんですけど... ページ表示の際(windowのonloadイベント)に、フォームに入力欄をクリアしてしまうとか、 戻ってきた時はそのまま残したいなら、「document.referrerを見て戻ってきたときは強制的にフォーカスを当てる、そうじゃない時はクリアーする」のように作ってはどうでしょうか
関連するQ&A
- jQueryでCSSの背景画像を切り替えたい
見出しをクリック後にCSSで指定している背景画像を変えるため、jQueryでCSSを変更させてみたところ上手くいきません。 jQueryで指定する変更後の背景画像を絶対パスに換えたら上手くいったので、 パスの指定方法が悪いところまでは分かったのですが、相対パスでの指定方法がわからなくなりました。 WordPress環境で下記のコードを使用しています。 ご教授の程、よろしくお願い致します。 【 jQuery】 ○ディレクトリ ： テーマフォルダ/js/change.js jQuery(function() { jQuery("h3 div.class").hide(); jQuery("h3").click(function() { jQuery(this).next().slideToggle("fast"); jQuery(this).css("background-image" , "url('img/pic2.jpg')"); }); }); 【CSS】 ○ディレクトリ : テーマフォルダ/style.css h3 { background: #7c8187; background-image: url(img/pic.jpg); cursor: pointer; } 【画像】 ○ディレクトリ : テーマフォルダ/img/pic.jpg テーマフォルダ/img/pic2.jpg
- ベストアンサー
- CSS
- cookie.jquery.jsでのcookie
cookie.jquery.jsでのcookie取得について 現在、cookie.jquery.jsでcookieを以下のように取得しています。 $(window).load(function(){ $.cookie("access",$('body').addClass('access'));}) たとえば、サイトを表示して10秒後にcookie取得したいと思い、setTimeoutを使用すれば良いと思ったのですが、うまく動作しませんでした。 このような使い方はできないのでしょうか？
- ベストアンサー
- JavaScript
- jQueryでcookie 追加書き込み
jQueryでcookieに追加書き込みをしたいのですが、どうやってもわかりません。 ここからクッキを追加書き込みを実現したいのですが、 どうやっても頭が回らず困って、混乱気味になっています。 誰か助けてください！ おねがいいたします！ <!DOCTYPE html> <html lang="jp"> <head> <meta charset="utf-8"> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.7.1");</script> <script type="text/javascript" src="jquery.cookie.js"></script> <script type="text/javascript"> //入力された値をCookieに保持する function cookie(){ $.cookie("cookie", $("#cookieValue").val()); $("#result").html($.cookie("cookie")); } //現在のCookieの値を出力 $(function() { $("#result").html($.cookie("cookie")); }); </script> <title></title> </head> <body> <input id="cookieValue" type="input"> <a href="index.html" onclick="ｃookie()">クッキー</a> <p><span id="result"></span></p> </body> </html>
- ベストアンサー
- JavaScript
- jqueryについて、$("+dd",this)について教えていただけ
jqueryについて、$("+dd",this)について教えていただけませんでしょうか 【参考サイト】 http://ascii.jp/elem/000/000/498/498710/index-6.html 上記のページのアコーディオンメニューを作る記述において、 $(function(){ $("dd:not(:first)").css("display","none"); $("dl dt").click(function(){ if($("+dd",this).css("display")=="none"){ $("dd").slideUp("slow"); $("+dd",this).slideDown("slow"); } }); }); の if($("+dd",this).css("display")=="none") の部分の"+dd"に何故、+が付くのでしょうか。 確かに上記の様に記述をすると上手く動作をしますので、正しいのだと 思うのですが、そうなる理由が解らなくて混乱してしまっています。 thisが示す$("dl dt")の下層の要素を指定するための記述ならば、 if($("this dd").css("display")=="none") として、$("dl dt")の下層にあるddという様な指定は出来ないのでしょうか。 まだ、ほとんどjqueryの記述ルールを把握していないので、お恥ずかしいのですが、 何卒、宜しくお願いいたします。
- ベストアンサー
- JavaScript
- jQuery プルダウンメニュー
プルダウンメニューの一部で行き詰っています。 メニュー１のサブメニューが開いている状態で、メニュー２をクリックした時 メニュー１のサブメニューが閉じるようにする(その逆パターンも含む)。 サブメニューにカーソルがある時、メニューはhoverさせないようにする。 ▼html----------------------------------------- <ul id="gNav"> <li>メニュー1 <ul> <li><a href="">サブメニュー1-1</a></li> </ul> </li> <li>メニュー2 <ul> <li><a href="">サブメニュー2-1</a></li> <li>サブメニュー2-2 <ul> <li><a href="">サブメニュー2-2-1</a></li> <li><a href="">サブメニュー2-2-2</a></li> <li><a href="">サブメニュー2-2-3</a></li> </ul> </li> </ul> </li> <li><a href="">メニュー3</a></li> </ul> ▼jQuery----------------------------------------- $(function(){ $("#gNav > li").click(function(){ $(this).children("ul").toggle(); }); $("#gNav > li > ul > li").mouseenter(function(){ $(this).children("ul").show(); }).mouseleave(function(){ $(this).children("ul").hide(); }); $("#gNav > li").hover(function(){ $(this).css("background-color","#ff9900"); },function(){ $(this).css("background-color","#ffcc00"); }); $("#gNav > li > ul > li").hover(function(){ $(this).css("background-color","#99cc66"); },function(){ $(this).css("background-color","#669933"); }); $("#gNav > li > ul >li > ul >li").hover(function(){ $(this).css("background-color","#dddddd"); },function(){ $(this).css("background-color","#eeeeee"); }); }); 宜しくお願いします。
- 締切済み
- JavaScript
- jQuery 背景のフェード
下記のliの背景色をフェードイン・アウトする方法は ありますでしょうか？ $("li").hover(function(){ $(this).css("background-color","#000000"); },function(){ $(this).css("background-color",""); }); <ul> <li><a href="#"><img src="xxx.png" /></a><li> <li><a href="#"><img src="xxx.png" /></a><li> </ul> 宜しくお願いします。
- 締切済み
- JavaScript
- jquery.cookie.jsを使用していますが
jquery.cookie.jsを使用していますが、ページ遷移した際に、クッキーが外れるみたいなのです。 現象としては、文字サイズや背景色を変えて（別CSSを読み込む）同じ階層のページへ遷移してもそのまま文字サイズも背景色も適用されたままなのですが、別階層（index.htmlからlink/a.htmlなどフォルダ内のHTMLファイル）に遷移すると適用が外れます。そしてlink/a.htmlでサイズ変更してそこからindex.htmlに戻ると変えたはずの文字サイズなどは解除されています。 おそらくjquery.cookie.jsの問題かと思いますが、どこをいじればいいのか分かりません。 お願いします。 以下、jquery.cookie.jsのソースです。 jQuery.cookie = function (key, value, options) { // key and value given, set cookie... if (arguments.length > 1 && (value === null || typeof value !== "object")) { options = jQuery.extend({}, options); if (value === null) { options.expires = -1; } if (typeof options.expires === 'number') { var days = options.expires, t = options.expires = new Date(); t.setDate(t.getDate() + days); } return (document.cookie = [ encodeURIComponent(key), '=', options.raw ? String(value) : encodeURIComponent(String(value)), options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE options.path ? '; path=' + options.path : '', options.domain ? '; domain=' + options.domain : '', options.secure ? '; secure' : '' ].join('')); } // key and possibly options given, get cookie... options = value || {}; var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent; return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null; };
- ベストアンサー
- JavaScript
- jqueryを使ってtrの中のthとtdの色を入れ替えたいと思っていま
jqueryを使ってtrの中のthとtdの色を入れ替えたいと思っています。 最近jqueryを導入してCSSをいじっているのですが、うまくいきません。 外部jsファイルで $(function(){ $(".A tr > *").mouseover(function(){ $(this).addClass("over"); }).mouseout(function(){ $(this).removeClass("over"); }); $(".A tr:even").addClass("even"); }); と書いています。 イメージとしてはテーブル中のtrで偶数と奇数で縞々になっているとことをマウスが乗っかるとそのtrに内包するthとtdが同じ色に変わるように設定したいと思っています。 外部CSSでは .over { background-color: #999; color: #FFF; } と設定しています。 これを実行するとするとthとtdが同時に色が変わらず、th上の時はthのみtd上の時はtdのみしか背景色がわりません。 参考となるURLだけでもかまいませんので、ご教授ください。
- ベストアンサー
- JavaScript
- Jqueryで最初の要素だけ特定のCSSを適応
Jqueryで最初の要素だけ特定のCSSを適応させたいのですが、うまくいきません。 やりたい事は、ページ内の一番初めのH2要素にだけ、「.top」というCSSを適応させたいのです。 現在は ※Jqueryソース $(function(){ $("h2:first").addClass("top"); }); ※CSSソース .top { padding-top: 2px; background-position: 0px 2px; } こんな感じで書いていますが、うまくいきませんでした。 記述の間違いなどご指摘頂ければ幸いです。 どうぞ宜しくお願い申し上げます。m(_ _)m
- ベストアンサー
- JavaScript
- jQueryのthisの使い方
javascript初心者なので根本的に勘違いしていたらすいません。 jQueryを使ってAAというclass領域をポイントしたら同じAAのclassを設定されているすべてのCSSをかきかえる、ということをしたいです。 $(document).ready(function(){ $(".AA").hover( function () { $(this).css('color', '#000000'); }, function(){ $(this).css('color', '#222222'); } ); }); ここまでは書いたのですが、ポイントしているところだけしか変わらないので、ページ内のすべての同じクラスに結果が反映されるようにしたいのですが書き方がそもそも間違ってるんでしょうか…。
- ベストアンサー
- JavaScript
お礼
回答ありがとうございます。 色々試してみましたが思ったとうりには、出来ませんでした。 できればコメントフォームなので一度コメントすると、 次回コメント時は名前など前回入力したものが出て、背景は消えている という状態にしたかったです。 せっかく教えて頂いた事もほぼ理解できず、 初心者の自分にはまだ早かったかもしれないです。