在Jquery中選擇一個元素的ID

Question

我有以下的HTML代碼片段。

<li my-id="10" class="my-class">test-1</li> 
<li my-id="15" class="my-class">test-2</li> 
<li my-id="20" class="my-class">test-3</li> 

任何人可以幫助我如何得到上面的一個HTML元素的ID，當點擊事件發生是。在解釋更多時，我在jquery中有以下代碼。當用戶點擊上述任何一個元素時，我需要提取的id對應相同的元素。我在jQuery中使用以下代碼。

$('.my-class').on('click', function(e) { 
var ids = e.targetElement.attr('my-id'); 
}); 

但上述代碼片段不起作用。任何人都可以提出更好的方法來做到這一點？

Answer 1

嘗試，使用atributes '身份證' 在你的名單

<li id="10" class="my-class">test-1</li> 
<li id="15" class="my-class">test-2</li> 
<li id="20" class="my-class">test-3</li> 

在JavaScript中，this.id

$('.my-class').on('click', function(e) { 
var ids = this.id; 
alert(ids); 
}); 

幷包含jquery。例如：https://jsfiddle.net/Cuchu/7h1ecsm7/

Answer 2

嘗試使用$(this)調用.attr()。因爲.attr()不會在一個節點對象的原型可用，

$('.my-class').on('click', function(e) { 
var ids = $(this).attr('my-id'); 
}); 

Answer 3

您需要使用e.currentTarget作爲這樣的選擇。

$('.my-class').on('click', function(e) { 
 
var ids = $(e.currentTarget).attr("my-id"); 
 
alert(ids) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li my-id="10" class="my-class">test-1</li> 
 
<li my-id="15" class="my-class">test-2</li> 
 
<li my-id="20" class="my-class">test-3</li>

Answer 4

attr()是一個jQuery方法，所以你應該把它jQuery對象$(this)上：

var ids = $(this).attr('my-id'); 

，如果你想的JavaScript替代，你可以使用getAttribute：

var ids = e.target.getAttribute('my-id'); 

希望這有助於。

---

$('.my-class').on('click', function(e) { 
 
    alert(e.target.getAttribute('my-id')+' ---- '+ $(this).attr('my-id')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<li my-id="10" class="my-class">test-1</li> 
 
<li my-id="15" class="my-class">test-2</li> 
 
<li my-id="20" class="my-class">test-3</li>

Answer 5

就與jQuery然後使用attr方法來得到你需要的屬性，把這個包：

$('.my-class').click(function() { 
    var ids = $(this).attr('my-id'); 
});