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>

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

jQueryでウィンドウサイズによって処理を変えるjQueryのeachと$.eachの簡単な使い方のメモ前のページ

WordPressでカスタムフィールドを使って任意のコードやファイルをhead内に読み込ませる次のページ

関連記事

  1. progresspieSVG

    JavaScript

    円形のプログレスバーを実装できる「progresspieSVG」

    progresspieSVGは円形のプログレスバーを実装できるjQue…

  2. TypeIt

    JavaScript

    タイピングアニメーションを実装できる「TypeIt」

    TypeItはタイピングアニメーションを実装できるjQueryプラグイ…

  3. Luminous

    JavaScript

    軽くてシンプルなLightboxを実装できるスクリプト「Luminous」

    Luminousを使えば軽くてシンプルなLightboxを実装すること…

  4. Rebox

    JavaScript

    レスポンシブ対応の軽量なLightbox風jQueryプラグイン「Rebox」

    ReboxというjQueryプラグインを使えば、レスポンシブに対応した…

  5. Notyf

    JavaScript

    シンプルでレスポンシブ対応のカッコイイ通知を表示できる「Notyf」

    Notyfはシンプルでレスポンシブに対応したカッコイイ通知を表示させる…

  6. Ion Zoom

    JavaScript

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Zoom」

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Z…

コメント

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

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

最近の記事

  1. ペットボトルホルスター
  2. SRS-XB43
  3. Nu:kin

アーカイブ

PAGE TOP