jQueryでウィンドウサイズによって処理を変える

JavaScript

jQueryで$.inArrayを使えば配列の中に指定した値が何番目に入ってるか知ることができる

jQueryで配列の中に自分が指定した値が何番目にあるか知りたい場合は$.inArrayを使えば知ることができます。使い方は簡単で、$.inArrayの第一引数に探したい値を指定して、第二引数に探し出す配列を指定するだけです。これで第一引数に、指定した値が入っているインデックスが返ってきます。わざわざforやらを使って調べなくてもいいので便利ですね。

[ads_center]

$.inArray()

以下、具体的な使い方のコードです。

arr = ["aaa", "bbb", "ccc"];
var i = $.inArray("bbb", arr);
document.writeln(i);

// 実行結果 1

こんな感じで使います。

もう少しだけ実用性を持たせてみます。以下はsampleというクラス名がついている要素を1つずつ配列に入れ、その中から「テキスト3」と書かれた要素のテキストを「ここを指定しました」と置き換えてみるサンプルです。

HTML

<p class="sample">テキスト1</p>
<p class="sample">テキスト2</p>
<p class="sample">テキスト3</p>
<p class="sample">テキスト4</p>
<p class="sample">テキスト5</p>

JavaScript

var n = $('.sample');
var arr = [];
var num = n.length;
for(var i = 0; i < num; i++){
    arr.push($(n[i]).text());
}
var j = $.inArray("テキスト3", arr);
$(n[j]).text("ここを指定しました");

// 実行結果
<p class="sample">テキスト1</p>
<p class="sample">テキスト2</p>
<p class="sample">ここを指定しました</p>
<p class="sample">テキスト4</p>
<p class="sample">テキスト5</p>

ということで、これだけだとあまり実用性が感じられないかもしれませんが、色々組み合わせていくことで少しは活躍するんじゃないかなと思いました。

関連記事

  1. WebSnowjq.js

    JavaScript

    Webページに雪を降らせてくれるjQueryプラグイン「WebSnowjq.js」

    WebSnowjq.jsはWebページの中に雪を降らせることができるj…

  2. Easy Responsive Tabs to Accordion

    JavaScript

    レスポンシブ対応のタブとアコーディオンで切り替わるjQueryプラグイン「Easy Responsi…

    今すぐにでも使いたいjQueryプラグインを見つけたので備忘録。レスポ…

  3. Excolo Slider

    JavaScript

    タッチにも対応しているシンプルなjQueryスライダー「Excolo Slider」

    タッチやマウススライドにも対応しているシンプルなjQueryスライダー…

  4. Typed.js

    JavaScript

    プログラムを入力するようにタイプするエフェクトを実装できる「Typed.js」

    Typed.jsは、プログラムを入力するように文字をタイプしてくれるエ…

  5. Expandy Menu

    JavaScript

    マウスオーバーで広がるメニューパネル「Expandy Menu」

    Expandy Menuはマウスオーバーすると横に広がるメニューパネル…

  6. Animated menu concept

    JavaScript

    かっこいいアニメーション付きメニュー実装「Animated menu concept」

    Animated menu conceptはかっこいいアニメーション付…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. プラスシェル シティ04 フォールディングカメラケース
  2. enerpad AC-27KS
  3. KMS-160

アーカイブ

PAGE TOP