Pertanyaan Bagaimana saya bisa memilih elemen dengan nama dengan jQuery?


Miliki kolom tabel yang saya coba perluas dan sembunyikan:

jQuery tampaknya menyembunyikan td elemen saat saya memilihnya kelas tapi tidak dengan elemen nama.

Misalnya, mengapa:

$(".bold").hide(); // selecting by class works
$("tcol1").hide(); // select by element name does not work

Perhatikan HTML di bawah ini, kolom kedua memiliki nama yang sama untuk semua baris. Bagaimana saya bisa membuat koleksi ini menggunakan name atribut?

<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>
<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>  
<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>

959
2017-07-10 01:05


asal


Jawaban:


Anda dapat menggunakan atribut pemilih:

$('td[name=tcol1]') // matches exactly 'tcol1'

$('td[name^=tcol]') // matches those that begin with 'tcol'

$('td[name$=tcol]') // matches those that end with 'tcol'

$('td[name*=tcol]') // matches those that contain 'tcol'

1801
2017-07-10 01:21



Atribut apa pun dapat dipilih menggunakan [attribute_name=value] cara. Lihat contohnya sini:

var value = $("[name='nameofobject']");

168
2017-09-22 19:07



Jika Anda memiliki sesuatu seperti:

<input type="checkbox" name="mycheckbox" value="11" checked="">
<input type="checkbox" name="mycheckbox" value="12">

Anda dapat membaca semua seperti ini:

jQuery("input[name='mycheckbox']").each(function() {
    console.log( this.value + ":" + this.checked );
});

Cuplikan:

jQuery("input[name='mycheckbox']").each(function() {
  console.log( this.value + ":" + this.checked );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="mycheckbox" value="11" checked="">
<input type="checkbox" name="mycheckbox" value="12">


51
2017-07-09 18:34



Anda bisa mendapatkan array elemen dengan nama cara lama dan meneruskan array ke jQuery.

function toggleByName() {
  var arrChkBox = document.getElementsByName("chName");
  $(arrChkBox).toggle();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
  <head>
    <title>sandBox</title>
  </head>
  <body>
    <input type="radio" name="chName"/><br />
    <input type="radio" name="chName"/><br />
    <input type="radio" name="chName"/><br />
    <input type="radio" name="chName"/><br />
    <input type="button" onclick="toggleByName();" value="toggle"/>
  </body>
</html>

Catatan: satu-satunya saat Anda memiliki alasan untuk menggunakan atribut "nama" seharusnya untuk kotak centang atau input radio.

Atau Anda bisa menambahkan kelas lain ke elemen untuk seleksi. (Inilah yang akan saya lakukan)

function toggleByClass(bolShow) {
  if (bolShow) {
    $(".rowToToggle").show();
  } else {
    $(".rowToToggle").hide();
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
  <head>
    <title>sandBox</title>
  </head>
  <body>
    <table>
      <tr>
        <td>data1</td>
        <td class="bold rowToToggle">data2</td>
      </tr>
      <tr>
        <td>data1</td>
        <td class="bold rowToToggle">data2</td>
      </tr>
      <tr>
        <td>data1</td>
        <td class="bold rowToToggle">data2</td>
      </tr>
    </table>
    <input type="button" onclick="toggleByClass(true);" value="show"/>
    <input type="button" onclick="toggleByClass(false);" value="hide"/>
  </body>
</html>


22
2017-07-11 05:25



Anda bisa mendapatkan nilai nama dari kolom input menggunakan elemen nama di jQuery oleh:

var firstname = jQuery("#form1 input[name=firstname]").val(); //Returns ABCD
var lastname = jQuery("#form1 input[name=lastname]").val(); //Returns XYZ 
console.log(firstname);
console.log(lastname);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="form1" id="form1">
  <input type="text" name="firstname" value="ABCD"/>
  <input type="text" name="lastname" value="XYZ"/>
</form>


18
2018-06-15 05:52



Kerangka kerja biasanya digunakan nama braket dalam bentuk, seperti:

<input name=user[first_name] />

Mereka dapat diakses oleh:

// in JS:
this.querySelectorAll('[name="user[first_name]"]')

// in jQuery:
$('[name="user[first_name]"]')

// or by mask with escaped quotes:
this.querySelectorAll("[name*=\"[first_name]\"]")

13
2017-10-16 16:27



Saya telah melakukan seperti ini dan itu berhasil:

$('[name="tcol1"]')

https://api.jquery.com/attribute-equals-selector/


12
2018-03-25 20:27



Berikut ini solusi sederhana: $('td[name=tcol1]')


5
2018-04-27 18:47