警报单个属性值

alert individual attribute value

本文关键字:属性 单个      更新时间:2023-09-26

我想通过每个元素的name属性来识别它。每个元素都具有相同的类,并且最终将包含不同的动态信息。

例如,我希望以下代码提醒单个元素的名称值:

html:

<p class="pexample" name="0">this is p #1</p>
<p class="pexample" name="1">this is p #2</p>
<p class="pexample" name="2">this is p #3</p>

jquery:

$('p').on('click', function() {
    if ($('p').attr('name') !== undefined) {
        alert($('p').attr('name'));
    }
})

这是一把小提琴。。http://jsfiddle.net/XG7nd/1/

但是,此代码仅提醒初始元素名称值。我们非常感谢您的帮助。

这应该做:

$('p').on('click', function() {
   var name = $(this).attr('name');// `this` here refers to the current p you clicked on
   if (name ) {
        alert(name); 
    }
})

在执行$('p').attr('name')时,这将始终为您提供集合中第一个项目的名称。

演示

试试这个:

$(document).on('click','p', function() {
    alert($(this).attr('name'));
});

DEMO

您想要使用$(this)

$('p').on('click', function() {
    if($(this).attr('name') !== 'undefined') {
        alert($(this).attr('name'));
    }
});

之所以会发生这种情况,是因为每次单击都会获得第一个<p>name属性。您需要指定事件的来源:

$('p').on('click', function() {
if ($(this).attr('name') !== undefined) {
    alert($(this).attr('name'));
}
})

注意,jQuery选择器返回一个匹配元素的数组。必须使用this关键字来获取当前上下文中元素的句柄。

FIDDLE

说明

即使在click上,您也要继续查找p元素,因此它会选择找到的第一个元素。

您的代码说明:

点击p时:

  • 查找p元素并提醒其属性

您真正想要的:

点击p时:

  • 提醒单击的元素的属性

解决方案

选择this的属性,该属性是单击的元素。

JSFiddle

JavaScript

$('p').on('click', function() {
    if ($(this).attr('name') !== undefined) {
        alert($(this).attr('name'));
    }
})

阅读有关this关键字的更多信息。