• ベストアンサー

jQuery eqメソッド　【eq】とは何の略？

jQuery のeqメソッドの学習に入りました。 おおよそ使い方はわかりましたが [eq]とは何の略ですか？ ざっと検索してみたのですが出てきませんでした。語源がわからないと何かすっきりしませんｌ ご存知の方いらっしゃいましたら教えて下さい。宜しくお願いします。 <ul> <li>インデックス0</li> <li>インデックス1</li> <li>インデックス2</li>　　（赤色になる） </ul> $('li').eq(2).css('color','red'); ↑

画像を拡大する

質問者が選んだベストアンサー

  • ベストアンサー
noname#252039
noname#252039
回答No.1

equals

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • jQueryのeqで最後からn番目以降を指定したい

    画面読込時の処理上、「最後から2番目以降を先頭に追加」という処理をしたく、jQueryの”.eq()”で上手く表現できないでしょうか。 ”最後からn番目”を指定する場合は、.eq(-n)とあり、末端は-1となっていたので、.eq(-2,-1)としましたが、上手くいきませんでした。 こんな記述をしました。 var $li = $('li','ul#id名'); $('ul#id名').prepend($li.eq(-2,-1)); これでは上手く行かなかったので、仕方なく $('ul#id名').prepend($li.eq(-2)); $('ul#id名').prepend($li.eq(-1)); としましたが、なんかカッコ悪いですよね。。。一発で追加でるようなやり方ないですかね。

  • 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のサンプルに機能を追加したいです！

    当方jQuery初心者です。 jQueryのサンプル「Dropline Menu 7」を使っています。 現在地となるcurrentがデフォ表示で赤字にて表示されていると思います。 その他メニューをマウスオーバーすると他メニューのサブメニューが下に表示されていきます。 しかし、マウスアウトすると直ぐデフォ表示に戻ってしまいます。 そこにマウスオーバー時に現われていたサブメニューがマウスアウトしてもすぐ消えない、2～3秒程の時間表示されるようなものを設け、 その設定した時間内にマウスオーバーするとそのまま表示を継続、というような機能をこのスクリプトに追加したいです。 http://jsajax.com/jQueryDroplineMenuArticle1167.aspx いろいろと調べてみたのですがいい方法が見つかりません。 使われている JScript.js の中身はこのようになっていました。 /* ====================================================== This copyright notice must be untouched at all times. Copyright (c) 2008 Stu Nicholls - stunicholls.com - all rights reserved. ========================================================= */ $(function() { $("#dropline li.current").children("ul").css("left", "0px").show(); $("#dropline li.current").children(":first-child").css("color", "#c00") $("#dropline li").hover(function() { if (this.className.indexOf("current") == -1) { getCurrent = $(this).parent().children("li.current:eq(0)"); if (this.className.indexOf("top") != -1) { $(this).children("a:eq(0)").css("color", "#069"); } else { $(this).children("a:eq(0)").css("color", "#000"); } if (getCurrent = 1) { $(this).parent().children("li.current:eq(0)").children("ul").hide(); ; } $(this).children("ul:eq(0)").css("left", "0px").show(); } }, function() { if (this.className.indexOf("current") == -1) { getCurrent = $(this).parent().children("li.current:eq(0)"); if (this.className.indexOf("top") != -1) { $(this).children("a:eq(0)").css("color", "#000"); } else { $(this).children("a:eq(0)").css("color", "#666"); } if (getCurrent = 1) { $(this).parent().children("li.current:eq(0)").children("ul").show(); ; } $(this).children("ul:eq(0)").css("left", "-99999px").hide(); } }); }); イベントのhover(over, out)で、out部のfunction() {～}　の処理内にて変更・追加すればよいのでしょうか？ どなたかご教授いただけますでしょうか、お願いします！

  • jQueryプラグインのメガドロップダウンメニュー

    jQueryプラグインのメガドロップダウンメニューについて 当方プログラミング初心者です。 至らない点ばかりですが、どうかご容赦ください。。。 この度、仕事でこのメガドロップダウンメニューを使用することになりました。 サンプルサイトです→(1)http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/advanced-styling/# (2)http://www.designchemical.com/lab/jquery-mega-drop-down-menu-plugin/download/ 使用したいのは、 (1)にあるサンプル（オンマウスすると車の写真などが出てくる） スタイルは(2)にある、白色のバー なのですが、どうもうまくいきません・・・ 上記サイトからダウンロードしたもの ・jquery.js ・jquery.dcmegamenu.1.3.3.js ・dcmegamenu.css ・white.css その他素材などが、指定した名前のフォルダに入っています。 英語が読めないので、わからない単語は調べたりしてなんとかメニューとして形にはできたのですが バーの色は黒いままだし、まずドロップダウンしません。 今、この状態のまま詰まってしまっています・・・ たぶんめちゃくちゃになってしまっていると思うのですが、 どこが悪いのかわかりません・・・＞＜ ★ＨＴＭＬ（ヘッド） <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ～～～ <head> <link rel="stylesheet" href="css/white.css" type="text/css" /> <script type="text/javascript" src="jquery/jquery.js"></script> <link rel="stylesheet" href="css/dcmegamenu.css" type="text/css" /> <script type="text/javascript" src="jquery/jquery.dcmegamenu.1.3.3.js"></script> <script type="text/javascript"> $(document).ready(function($){ $("mega-menu").dcMegaMenu({ rowItems: "3", speed: "fast" }); }); </script> </head> ★ＨＴＭＬ（ボディ） <div class="dcjq-mega-menu demo-container"> <ul id="mega-menu" class="menu"> <li><a href="#">Home</a></li> <li><a href="#">Vehicles</a> <ul> <li id="menu-item-1"><a href="#">Coupe</a> <ul> <li><a href="#">Citroen C4</a></li> <li><a href="#">Honda CR-Z</a></li> <li><a href="#">BMW 3 Series</a></li> <li><a href="#">Volvo C30</a></li> </ul> </li> <li id="menu-item-2"><a href="#">Saloon</a> <ul> <li><a href="#">Volkswagen Passat</a></li> <li><a href="#">Volvo S40</a></li> <li><a href="#">Vauxhall Insignia</a></li> <li><a href="#">Mitsubishi Lancer</a></li> </ul> </li> ～～～～～～～～省略 <li id="menu-item-6"><a href="#">High Performance Cars</a> <ul> <li><a href="#">Lamborghini Gallardo</a></li> <li><a href="#">Ferrari F430</a></li> <li><a href="#">Aston Martin Vantage</a></li> <li><a href="#">Porsche 911 Turbo</a></li> </ul> </li> </ul> </li> <li><a href="#">About Us</a> <ul> <li><a href="#">About Us</a></li> <li><a href="#">About Us</a></li> </ul> </li> <li><a href="#">Services</a></li> <li><a href="#">Contact us</a></li> </ul> </div> 名前はまだサンプル通りです。 ★ＣＳＳ(1)（dcmegamenu.css） http://www.designchemical.com/lab/jquery-plugins/jquery-mega-drop-down-menu/css/dcmegamenu.css ★ＣＳＳ(2)（white.css） http://www.designchemical.com/lab/jquery-plugins/jquery-mega-drop-down-menu/css/skins/white.css つっこみ所だらけかと思います・・・すみません・・・ どこが悪いのでしょうか・・・？ 私のような初心者にはまだまだ早いプログラミングなのかもしれませんが、 どうか、お力添えをお願いできれば、、、、お願いします。

  • jQueryについて教えてください

    現在ドットインストールでjQueryを勉強しています いきなりつまずいたといいますかエラー？があります 以下のコードなのですが文字色（<p>）が赤色になりません なぜでしょうか？ このコードではjQueryはDLせずに読み込ませています DLしたほうがいいでしょうか？ <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <head> <body> <p>jQueryの練習</p> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script> $(function () { $('p').css('color', 'red'); }); </script> </body> </html>

  • jQueryで記事を６列表示にしたいのです。

    ｊQueryで記事を６列表示にしたいのです。 jQueryで６列表示をしたいと思って試行錯誤をしていたのですが、 全くわからずじまいで、どうしたらいいのかと知恵袋に投稿致しました。 各カテゴリごとに表示をするようになっているのですが、 オールだけ全て表示になります。 ５つ残して表示させればいいのですが、各カテゴリが 消えてしまうので、どうしてもオールは６行表示させたいと思っています。 どなたか助けていただけませんでしょうか？ jQuery ---------------------------------------------- $(document).ready(function() { $('ul#navi a').click(function() { $(this).css('outline','none'); $('ul#navi .all').removeClass('current'); $(this).parent().addClass('current'); var filterVal = $(this).text().toLowerCase().replace(' ','-'); if(filterVal == 'all') { $('ul#portfolio li.hidden').fadeIn('slow').removeClass('hidden'); } else { $('ul#portfolio li').each(function() { if(!$(this).hasClass(filterVal)) { $(this).fadeOut('normal').addClass('hidden'); } else { $(this).fadeIn('slow').removeClass('hidden'); } }); } return false; }); }); HTML ---------------------------------------------- <ul id="navi"> <li class="all"><a href="#">All</a></li> <li><a href="#">CMS</a></li> <li><a href="#">CSS</a></li> <li><a href="#">Javascript</a></li> </ul> <ul id="portfolio"> <li class="cms"><a href="#">Movable Type</a></li> <li class="cms"><a href="#">Movable Type</a></li> <li class="cms"><a href="#">Movable Type</a></li> <li class="css"><a href="#">CSSテンプレート</a></li> <li class="javascript"><a href="#">prototype</a></li> <li class="css"><a href="#">CSSビギナー</a></li> <li class="css"><a href="#">CSSテンプレート</a></li> <li class="css"><a href="#">CSSテンプレート</a></li> <li class="javascript"><a href="#">jQuery</a></li> <li class="javascript"><a href="#">jQuery</a></li> <li class="javascript"><a href="#">jQuery</a></li> <li class="javascript"><a href="#">jQuery</a></li> <li class="javascript"><a href="#">plugin</a></li> </ul>

  • jQueryでリスト項目の表示・非表示を切りかえる

    jQueryに詳しい方教えてください。 下記のようなHTMLがあって、 jQueryを使って<li>要素の表示／非表示を切り替えたいのです。 ---------------- HTMLスクリプト <ul class="test"> 　<li>項目1</li> 　<li>項目1</li> 　<li>項目1</li> </ul> 切り替えるタイミングはxmlのデータ内にflagを立てています。 flagの値は取得できました。（確認済み） 仕様としては、flagの値が 0の時は→<li>要素の1つ目と2つ目を表示させる。 1の時は→<li>要素の3つ目のみを表示させる。 2の時は→<li>要素のすべてを表示させる。 ということをしたいのです。 ですが、なぜかうまくいきません。 以下のように書きました。 if(flag==0){ 　$(".test li:eq(2)").hide(); }else if(settlementflag==1){ 　$(".test li:eq(0)"), .test li:eq(1)").hide(); }else if(settlementflag==2){ 　//何もしない }; そもそもこうゆう書き方で合っているのしょうか？ jQueryを勉強したてで、恥ずかしいばかりですが、 ご教授のほど宜しくお願いいたします。

    • ベストアンサー
    • AJAX
  • jQueryで複数あるUL要素の最後のLI要素以外を処理したい

    jQueryで複数あるUL要素の最後のLI要素以外を処理したい 現在、HTMLを <ul> <li>foo</li> <li>bar</li> <li>com</li> </ul> <ul> <li>foo</li> <li>bar</li> <li>com</li>（※） </ul> 上記のように記述しています。 今回、jQueryを使い、2カ所あるUL要素の最後のLI要素以外を処理したいと思い、 $(function(){ $("ul li:not(:last)").css("～","～"); }); 以上のようにjQueryを記述したところ、1カ所目の最後のLI要素は無視されCSSが追加されてしまいました。 1カ所目・2カ所目とも同じように処理するにはどうしたら良いでしょうか？ ご指導・ご鞭撻のほど、よろしくお願いします。

    • ベストアンサー
    • AJAX
  • jquery 3の倍数のliだけ色を変える

    jqueryでcssの変更をしたいのですが、 <ul> <li>test</li> <li>test</li> <li>test</li> <li>test</li> <li>test</li> <li>test</li> </ul> 例えば、こういうhtmlがあった場合、 3の倍数（3,6）のliだけcssを付け加えたいのですが、 どうしたらよいでしょうか。 また、3,6は例に出しただけで、 4の倍数や5の倍数に変更する場合もあるので、 そういう方法があれば、ご教授お願いたします。

  • jqueryの質問です

    jqueryで .tes01と.tes02は同じ番目をセットと考え .tes01 の画像をクリックした時に .tes02のリンクをクリックした状態にしたいと思っています。 .tes02のURLの取得は出来たのですがそれ以降が出来ないので教えてもらえますでしょうか。 $(function(){ $("ul.tes01 li").click(function(){ var tes01li = $(this).index(); var tes02li = $(".tes02 li").find("a").eq(tes01li).attr("href"); tes02li.click(); }); }); <ul class="tes01"> <li><img src="img01"></li> <li><img src="img02"></li> <li><img src="img03"></li> <li><img src="img04"></li> </ul> <ul class="tes02"> <li><a href="#link01">link01</a></li> <li><a href="#link02">link02</a></li> <li><a href="#link03">link03</a></li> <li><a href="#link04">link04</a></li> </ul>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する