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. Turntable.js

    JavaScript

    画像を使ってストップモーション動画のような効果を実装できる「Turntable.js」

    Turntable.jsは複数の画像を使ってストップモーション動画のよ…

  2. no-image

    JavaScript

    フォームに文字制限を設定できるjQueryプラグイン「Character Limit」

    Character Limitは、フォーム要素に文字制限を設定するため…

  3. Salvattore
  4. Amigo Sorter Plugin

    JavaScript

    タッチ対応で直感的に並べ替えできるjQueryプラグイン「Amigo Sorter Plugin」

    Amigo Sorter Pluginは、タッチ対応で直感的にリスト項…

  5. BetterToggle

    JavaScript

    要素を拡大しながら表示させたり非表示にしたりできるjQueryプラグイン「BetterToggle」…

    面白いjQueryプラグインがあったのでご紹介します。指定した要素を拡…

  6. Typewriter JS

    JavaScript

    タイプライターっぽいエフェクトでテキストを表現できる「Typewriter JS」

    Typewriter JSは、タイプライターを使って文字入力するような…

コメント

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

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

最近の記事

  1. macOS Mojaveのダークモード
  2. Olli
  3. 単語帳メーカー(Flashcard Maker App)
  4. 1Password 7

Facebookページ

PAGE TOP