jQuery 遍历 - map() 方法

Panduan Penelusuran jQuery

实例

构建表单中所有值的列表：

$("p").append($("input").map(function(){}
  return $(this).val();
).get().join(", ") );

Coba sendiri

Definisi dan penggunaan

map() mengirim setiap elemen melalui fungsi ke dalam koleksi yang cocok saat ini, untuk menghasilkan objek jQuery baru yang mengandung nilai kembalikan.

Sintaks

.map(callback(index,domElement))
Parameter Deskripsi
callback(index,domElement) Objek fungsi yang dipanggil untuk setiap elemen dalam koleksi saat ini.

Penjelasan detil

Karena nilai kembalikan adalah array yang disembunyikan oleh jQuery, gunakan get() untuk menangani objek kembalikan untuk mendapatkan array dasar.

.map() metode sangat berguna untuk mendapatkan atau mengatur nilai koleksi elemen. Pikirkan contoh berikut yang memiliki sejumlah kotak centang dalam formulir:

<form method="post" action="">
  <fieldset>
    <div>
      <label for="two">2</label>
      <input type="checkbox" value="2" id="two" name="number[]">
    </div>
    <div>
      <label for="four">4</label>
      <input type="checkbox" value="4" id="four" name="number[]">
    </div>
    <div>
      <label for="six">6</label>
      <input type="checkbox" value="6" id="six" name="number[]">
    </div>
    <div>
      <label for="eight">8</label>
      <input type="checkbox" value="8" id="eight" name="number[]">
    </div>
  </fieldset>
</form>

Kami dapat mendapatkan daftar yang dipisahkan koma dari ID kotak centang:

$(':checkbox').map(function() {
  return this.id;
).get().join(',');

Coba sendiri

Hasil pemanggilan ini adalah string: "two,four,six,eight".

Dalam fungsi callback, this merujuk kepada elemen DOM saat ini untuk setiap iterasi. Fungsi ini dapat mengembalikan item data tunggal, atau array item yang akan disisipkan ke dalam hasil koleksi. Jika yang dikembalikan adalah array, elemen array akan disisipkan ke dalam koleksi. Jika fungsi mengembalikan null atau undefined, maka tidak akan disisipkan elemen apapun.

Panduan Penelusuran jQuery