- ベストアンサー
juaryについて
- juaryについての質問に対する解決方法についてまとめます。
- テキストの横に必要記入という文字を表示する方法や、文字を消す方法について解説します。
- チェックボックスのすべての選択を取り消すプログラムについて説明します。
- みんなの回答 (3)
- 専門家の回答
関連するQ&A
- JavaScriptコードの最適化
JavaScript、超初心者です。 よくわからないので、同じコード3つ書いています。 もっと簡単に最適化されたコードはどう書けばよいですか? 宜しくお願いします。 $(function () { $(".aaa").click(function(){ window.open($(this).find("a").attr("href"), '_blank'); return false; }); $(".bbb").click(function(){ window.open($(this).find("a").attr("href"), '_blank'); return false; }); $(".ccc").click(function(){ window.open($(this).find("a").attr("href"), '_blank'); return false; }); });
- ベストアンサー
- JavaScript
- jqueryについて
jqueryについて こんな内容のjqueryをひとつにまとめて、なおかつ01~99(実績数)までのidを割り振る設定したいのですが可能でしょうか? 例えば $(function(){ $("#navi01-99 a").click(function(){ $("#main01-99 img").attr("src",$(this).attr("href")); return false; }); みたいな感じであとはidに番号を付ければいいみたいな・・・出来ませんでしょうか? 用途は仕事の制作実績で使用したいのですが、どなたか教えていただけますでしょうか? $(function(){ $("#navi01 a").click(function(){ $("#main01 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi02 a").click(function(){ $("#main02 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi03 a").click(function(){ $("#main03 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi04 a").click(function(){ $("#main04 img").attr("src",$(this).attr("href")); return false; }); }); $(function(){ $("#navi05 a").click(function(){ $("#main05 img").attr("src",$(this).attr("href")); return false; }); });
- ベストアンサー
- AJAX
- JavaScriptのプログラムについて
$(function(){ $("#top a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) $("#question a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) $("#q001 a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) $("#q002 a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) $("#q003 a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) $("#q004 a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) }); ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ HTMLは少し分かりますが JavaScriptがまったく分からない素人です。 ネットで調べて上記のようにプログラムし ページ内リンクを流れるようにスクロールさせることは出来ました。 まずこのプログラムの書き方で合っていますでしょうか? また、同じ記述が繰り返されているので短くしてやろうと自分なりに $("#q001 a") $("#q002 a") $("#q003 a") $("#q004 a") $("#q005 a").click(function(){ $('html,body').animate({ scrollTop: $($(this).attr("href")).offset().top }, 'slow','swing'); return false; }) ↑のような全くの当て推量の書き方をしてみましたが動作しませんでした。 省略したり短く出来る余地があればそれも教えていただきたいです。 分かる方がおられましたらお願いします。
- ベストアンサー
- JavaScript
- jQueryでdivごとリンクする際の開き方の指定
jQueryでdivごとリンクする際に 新しいウィンドウで開くものと、同じウィンドウで開くものを分けたいのです。 下にコードを載せています。 素人なりにおかしいかと思っている点は、 同じfunction()を続けて使っているところです。 2つのスクリプトをそれぞれ1つだけ書いた時はうまく動作します。 どのように書いたらよいでしょうか? よろしくお願いいたします。 ●新しいウィンドウで開きたいdiv要素 aaa,bbb,ccc ●同じウインドウで開きたいdiv要素 ddd,eee ------------------------------------------- <script type="text/javascript"> $(function(){ $(".aaa,.bbb,.ccc").click(function(){ window.open ( $(this).find('a').attr('href'), 'newwin' ); return false; }); }); </script> <script type="text/javascript"> $(function(){ $(".ddd,.eee").click(function(){ window.open ( $(this).find('a').attr('href'); return false; }); }); </script> -------------------------------------------
- ベストアンサー
- JavaScript
- juaryについて質問
$("#s1").click(function(){ $(":checkbox").attr("checked"); return false; }); これチェックボックスにすべてチェックを入れるプログラムです。 逆に取り消すプログラムを実践したいのですが 上手くいきません。 $("#s2").click(function(){ $(":checkbox").attr(""); return false; }); とか色々やっていますが上手く生きません。 じつはformをやっていない状態だと 消えるのですが、formタグ上だと 送信ボタンになってしまいます。 何かいい手はありませんでしょうか?
- ベストアンサー
- JavaScript
- JQueryを使ってcssを書き換え
何となくコードを見てさわる程度の初心者です。 以下のようなソースを組みました。 <div id="slide"> <a href="01.htm"><img src="01.jpg" alt="01" id="alttxt" /></a> </div> <div id="slidenavi"> <ul> <li><a href="01.html"><img src="s_01.jpg" alt="01" class="b_01.jpg" /></a><span class="active"></span></li> <li><a href="02.htm"><img src="s_02.jpg" alt="02" class="b_02.jpg" /></a><span class="active"></span></li> <li><a href="03.html"><img src="s_03.jpg" alt="03" class="b_03.jpg" /></a><span class="active"></span></li> </ul> </div> #slideがメインエリアで、#slidenaviがメインエリアの画像とリンク先を切り替えるナビゲーションボタンになっています。 ナビに連動したメインエリア用の画像ファイル名は #slidenavi の img の classに入れておいて、それを読み込んで代入するというおかしなやり方で呼び出していますが、ここまではうまくいきました。 問題はここからです。 最初の状態では<span class="active"></span>はcssの設定でdisplay: noneとしてあります。 そして#slidenaviのボタンにマウスが乗ると、その部分の<span class="active"></span>をdisplay: blockとして表示したいのですが、これがどうしてもうまくいきません。 この部分も含めて、おかしな書き方になっている部分があれば教えてもらえないでしょうか。 jsファイルは以下の通りです。 $(function(){ $('#slidenavi ul li a').fadeTo(0,0.4); $('#slidenavi ul li a').hover(function(){ $(this).fadeTo(300,1.0); }, function(){ $(this).fadeTo(300,0.4); }) $('#slidenavi ul li img').mouseover(function(){ var bglink = $(this).attr("class"); var altTxt = $(this).attr("alt"); $("#slide img").attr("src","images/home/main/"+bglink); $("#slide img").attr("alt",altTxt); $("#slide span.active").css("display","block"); }); $('#slidenavi ul li a').mouseover(function(){ var Href = $(this).attr('href'); var Tget = $(this).attr('target'); $("#slide a").attr("href", Href); $("#slide a").attr("target", Tget); $("#slide a").click(function() { window.open(Href,'_self'); return false; }); }); });
- ベストアンサー
- JavaScript
- jQueryの$(this)について
閲覧ありがとうございます。 初歩的な質問で申し訳ないのですがthisのことがすこし混乱してしまい、わからなくなってしまったので下記の場合のthisはどこを読み込むか教えてもらえると助かります。 目的:aをクリックしたときimgのsrcにaのhrefに指定してあるものを埋め込む処理 $(function(){ $("a").click(function(){ $("ul li img").fadeOut(function(){ $(this).attr(src,$("a").attr("href")).fadeIn(); }); return false; });
- ベストアンサー
- JavaScript
- onChange2回実行
すみません。 今は下記のようにjquery.1-4-2.min.jsを利用しています。 -------------------------------------- $(function() { var el; $("select.default") .each(function() { el = $(this); el.data("origWidth", $(this).css("width")) }) .mouseenter(function(){ $(this).css("width", "auto"); if(($(this).context.clientWidth)< Number($(this).data("origWidth").replace(/px/,"")) ||"100%" == $(this).data("origWidth")){ $(this).css("width", $(this).data("origWidth")); } }) .bind("blur change", function(){ el = $(this); el.css("width", el.data("origWidth")); }); }); ------------------------------------ Htmlでselectドロップダウンについて、onchange=onUserChange(value)をします。 但し、select dropdownを選択したら、このonUserChangeが二度呼び出されました。 ソースDebugし、下記のJquery利用するため二度実行します。 ----------------------------------- .bind("blur change", function(){ el = $(this); el.css("width", el.data("origWidth")); }); ------------------------------------ どうしてonUserChangeが二度実行しますか。私は一回だけ欲しいです。。。 ご教えていただけませんか。
- 締切済み
- JavaScript
- jQuery class要素を盛り込むには
画像をマウスオーバーで変化させるコードを、こちらで教えていただいたアドバイスに従って以下の内容で行っています。 $(function(){ $('span img').hover(function(){ $(this).attr('src', $(this).attr('src').replace('.jpg', 'x.jpg')); }, function(){ if (!$(this).hasClass('currentPage')) { $(this).attr('src', $(this).attr('src').replace('x.jpg', '.jpg')); } }); }); BODY部分は、 <SPAN><IMG src="画像.jpg"></SPAN> となっています。 けれど、よくよく考えると、マウスオーバーしたくない画像でも<SPAN>の中に記述していたらコードの影響をうけて、存在しない(マウスオーバー後の)画像を読み込もうとしてしまいます。 基本的な質問で申し訳ないのですが、 区別するため、例えば、マウスオーバーさせたい<SPAN>にはclass要素を入れて、 <SPAN class="change"><IMG src="画像.jpg"></SPAN> としたとして、上記のコードの、 $('span img').hover(function(){ の辺りをどうにか変えればいいように思うのですがよくわかりません。 基本的すぎて申し訳ありませんが、よろしくお願いします。
- ベストアンサー
- JavaScript
- javascriptについて
現在会社のHPのお問い合わせフォームを作っています。 フォーム画面で確認ボタンを押すと、確認画面を表示させたく、 http://blog.material-being.com/portfolio/auto_confirm/ こちらのページのjavascriptをつかって、作ってみたのですが、 書かれているソースで分からないところがあります。 switch ($(this).attr('type')) { //--------------------------------- // hidden, button, submit:何もしない //--------------------------------- case 'hidden': case 'button': case 'submit': break; //--------------------------------- // checkbox, radio:選択されたラベルの値を取得 //--------------------------------- case 'checkbox': case 'radio': var checkOrRadioName = $(this).attr('name'); //同じName属性の要素を既に処理していなければ if(checkOrRadioNames.indexOf($(this).attr('name')) == -1) { checkOrRadioNames += checkOrRadioName + ','; // x+= y → x = x + y var checks = ''; $(formClass + ' [name="'+checkOrRadioName+'"]:checked').each(function() { //チェックボックスのチェック要素の選択。 if(getLabelCR) { //ラベルの値を取得する場合 var checkOrRadioVal = $('label[for="'+$(this).attr('id')+'"]').html(); }else{ //Valueの値を取得する場合 var checkOrRadioVal = $(this).val(); } if(checks == '') { checks += checkOrRadioVal; }else{ checks += ',' + checkOrRadioVal; } }); $(formClass + ' [name="'+checkOrRadioName+'"]:last').after('<span class="autoConfirmVal">'+ checks +'</span>'); } $('label[for="'+$(this).attr('id')+'"]').css('display', 'none'); break; //--------------------------------- // password:入力文字を"*"記号に置き換える //--------------------------------- case 'password': $(this).after('<span class="autoConfirmVal">'+ $(this).val().replace(/./g, '*') +'</span>'); break; default : $(this).after('<span class="autoConfirmVal">'+ $(this).val() +'</span>'); } このradio部分がよくわかりません。 (1) var checkOrRadioName = $(this).attr('name'); if(checkOrRadioNames.indexOf($(this).attr('name')) == -1) { これは、同じものを検索しているのように見えるのですが、、-1になるのでしょうか? (2) $(formClass + ' [name="'+checkOrRadioName+'"]:checked').each(function() { var checkOrRadioVal = $('label[for="'+$(this).attr('id')+'"]').html(); 上記の大括弧は何を意味するのでしょうか? forとはなんでしょうか。 (3) .eachは繰り返しなのでしょうか? 以上、よろしくお願いいたします。
- 締切済み
- JavaScript
- 不登校の私にとって、恋愛や学校に行かずに就職することは可能なのでしょうか?
- 不登校生活で友達とは遊ぶことができますが、恋愛や彼氏を作ることはできないのでしょうか?
- 将来の就職についても心配です。不登校のままでは就職できないのでしょうか?
お礼
今日実行に移せてページが完成しつつあります。 大変お世話になりました。 またお願いします
補足
ばっちりでした^^ すごい。素晴らしい。 恥を忍んでお願いします。 解説をお願いしたいのです。 $(this).parent().next().css("display","inline") } else { $(this).parent().next().css("display","none"); } の部分です。 keyupもじつはよく解ってないのですが、 next()は解ります。よくアコーディオンに使うのに僕は使います。 クリックする事で次の要素が開くという感じです。 parentは始めでなのでやはり解りません。 最後のdisplayはこれはタブを作るのと一緒ではと思います。 クリックして背景が入れ替わるのと一緒だと思います。 ただinlineであってblockでないのは何故なんだろうと思いました。 すいません。技術を詰めたいのです。