Bagaimana cara mendapatkan data-atribut id?

I'm menggunakan jQuery plugin pasir. Saya perlu untuk mendapatkan data-id item diklik dan menyebarkannya ke jejaring. Bagaimana cara mendapatkan data-atribut id? I'm menggunakan .pada() metode untuk kembali mengikat acara klik untuk item diurutkan.

$("#list li").on('click', function() {
  //  ret = DetailsView.GetProject($(this).attr("#data-id"), OnComplete, OnTimeOut, OnError);
  alert($(this).attr("#data-id"));
});
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> 
<ul id="list" class="grid">
  <li data-id="id-40" class="win">
    <a id="ctl00_cphBody_ListView1_ctrl0_SelectButton" class="project" href="#">
      <img src="themes/clean/images/win.jpg" class="project-image" alt="get data-id" />
    </a>
  </li>
</ul>
Bruce Adams
Pertanyaan edit 29 Oktober 2018 в 6:07
Pemrograman
javascript jquery custom-data-attribute
15 Maret 2011 в 9:44
30 tayangan
Mengomentari pertanyaan (4)
Larutan

Untuk mendapatkan isi dari atribut data-id(seperti dalamlink`) anda harus menggunakan

$(this).attr("data-id") // will return the string "123"

atau .data() (jika anda baru menggunakan jQuery >= 1.4.3)

$(this).data("id") // will return the number 123

dan bagian setelah data harus ditulis dengan huruf kecil, misal data-idNum tidak akan bekerja, tapi data-idnum akan.

Kaushik Thanki
Jawaban edit 16 Oktober 2017 в 9:22
Komentar (15)

Jika kita ingin mengambil atau memperbarui atribut ini menggunakan yang sudah ada, asli JavaScript, maka kita dapat melakukannya dengan menggunakan getAttribute dan setAttribute metode seperti yang ditunjukkan di bawah ini:

Melalui JavaScript 

<div id='strawberry-plant' data-fruit='12'></div>

<script>
// 'Getting' data-attributes using getAttribute
var plant = document.getElementById('strawberry-plant');
var fruitCount = plant.getAttribute('data-fruit'); // fruitCount = '12'

// 'Setting' data-attributes using setAttribute
plant.setAttribute('data-fruit','7'); // Pesky birds
</script>

Melalui jQuery

// Fetching data
var fruitCount = $(this).data('fruit');
OR 
// If you updated the value, you will need to use below code to fetch new value 
// otherwise above gives the old value which is intially set.
// And also above does not work in ***Firefox***, so use below code to fetch value
var fruitCount = $(this).attr('data-fruit');

// Assigning data
$(this).attr('data-fruit','7');

Baca dokumentasi ini

Lalit Kumar Maurya
Jawaban edit 16 Februari 2016 в 4:32
Komentar (0)

Catatan penting. Perlu diingat, bahwa jika anda mengatur data - atribut secara dinamis melalui JavaScript ini TIDAK akan tercermin dalam data () fungsi jQuery. Anda harus menyesuaikan itu melalui data() fungsi juga.

<a data-id="123">link</a>

js:

$(this).data("id") // returns 123
$(this).attr("data-id", "321"); //change the attribute
$(this).data("id") // STILL returns 123!!!
$(this).data("id", "321")
$(this).data("id") // NOW we have 321
Serge Shultz
Jawaban edit 29 Mei 2015 в 3:22
Komentar (2)

Jika anda tidak peduli tentang old browser IE, anda juga dapat menggunakan HTML5 dataset API

HTML

<div id="my-div" data-info="some info here" data-other-info="more info here">My Awesome Div</div>

JS

var myDiv = document.querySelector('#my-div');

myDiv.dataset.info // "some info here"
myDiv.dataset.otherInfo // "more info here"

Demo: http://html5demos.com/dataset

Browser penuh daftar dukungan: http://caniuse.com/#feat=dataset

Komentar (1)

Terkejut tidak ada disebutkan: 


<select id="selectVehicle">
     Mazda
     Honda
     Mercedes
     Toyota
Komentar (1)

HTML

<span id="spanTest" data-value="50">test</span>

JS

$(this).data().value;

atau

$("span#spanTest").data().value;

ANS : 50

Bekerja untuk saya!

Pmpr
Jawaban edit 19 Mei 2016 в 6:16
Komentar (0)
 
var id = $(this).dataset.id

bekerja untuk saya!

Komentar (0)

Saya menggunakan $.data - http://api.jquery.com/jquery.data/

//Set value 7 to data-id 
$.data(this, 'id', 7);

//Get value from data-id
alert( $(this).data("id") ); // => outputs 7
Komentar (0)

Mengakses data atribut dengan sendiri id agak mudah bagi saya.

$("#Id").data("atribut");

function myFunction(){
  alert($("#button1").data("sample-id"));
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 Clickhere
Zakaria Acharki
Jawaban edit 27 Juli 2018 в 4:31
Komentar (0)

Bagian kode ini akan mengembalikan nilai dari atribut data misalnya: data-id, data-time, data-nama dll.., aku telah ditunjukkan untuk id

<a href="#" id="click-demo" data-id="a1">Click</a>

js:

$(this).data("id");

// mendapatkan nilai dari data-id -> a1

$(this).data("id", "a2");

// ini akan mengubah data-id -> a2

$(this).data("id");

// mendapatkan nilai dari data-id -> a2

Ashokkumar C
Jawaban edit 26 Maret 2018 в 2:49
Komentar (0)

menggunakan jQuery:

  $( ".myClass" ).load(function() {
    var myId = $(this).data("id");
    $('.myClass').attr('id', myId);
  });
Komentar (0)

Bagi mereka yang mencari untuk secara dinamis menghapus dan re-mengaktifkan tooltip, anda dapat menggunakan membuang dan mengaktifkan metode. Lihat https://getbootstrap.com/docs/4.0/components/tooltips/#tooltipdispose

Komentar (0)