Question

我点击时尝试使用特定ID获取每个div的类。

这是我尝试过的。

$("#chng").click(function() {
   var myClass = $(this).attr("class");
   alert(myClass);
});

这只适用于第一个div，而不适用于其他人。

这是HTML

<div id="chng" class="a"></div>
<br/>
<div id="chng" class="b"></div>
<br/>
<div id="chng" class="c"></div>
<br/>
<div id="chng" class="d"></div>

我提示可以在这里使用each（）函数，但我不知道如何使用它。请为此提供解决方案。也可以获得我点击这些div的背景图像的网址吗？

background: url(bg1.jpg) no-repeat;

Answer 1

切换它。

将id作为您的课程，将您的课程作为您的ID ID 必须是唯一的，您的课程不必是。

HTML：

<div class="chng" id="a"></div>
<br/>
<div class="chng" id="b"></div>
<br/>
<div class="chng" id="c"></div>
<br/>
<div class="chng" id="d"></div>

JS：

$(".chng").click(function() {
   var myID = this.id;
   alert(myID);
});

Answer 2

也许您应该通过class属性检测点击元素，然后点击div的id。

Answer 3

ID应该是唯一的，因此您应该交换您的类名和ID，使其如下所示：

<div id="a" class="chng"></div>
<br/>
<div id="b" class="chng"></div>
<br/>
<div id="c" class="chng"></div>
<br/>
<div id="d" class="chng"></div>

那么我在JQuery中会做的是：

$(".chng").click(function() {
   var myClass = $(this).attr("id");
   alert(myClass);
});

以下是我修改后的代码版本的简单提示：http://jsfiddle.net/cVYVf/4/

Answer 4

因为id应该是唯一的，并且您不能对多个元素使用相同的ID。这就是为什么它只适用于第一个div而不是其他人。

要获取背景图片，您可以使用$(this).css('background-image')

示例：

HTML

<div class="chng" id="a"></div>
<br/>
<div class="chng" id="b"></div>
<br/>
<div class="chng" id="c"></div>
<br/>
<div class="chng" id="d"></div>

JS

$('.chng').click(function() {
    alert($(this).css('background-image').replace('url("', '').replace('")', ''));
});

CSS

.chng {height: 100px;}
#a {background: #ccc url(bg1.jpg) no-repeat;}
#b {background: red url(bg2.jpg) no-repeat;}
#c {background: blue url(bg3.jpg) no-repeat;}
#d {background: green url(bg4.jpg) no-repeat;}

Demo Link

Answer 5

文档中的ID必须是唯一的。

Answer 6

要按ID和类选择内容，您需要使用选择器语句。

$("#id.classname").click(foo);

或在这种情况下

$("#chng.a(or any other class)").click(foo);

http://jsfiddle.net/fzrTN/ - jsfiddle表示效果

编辑2：

但正如已经说过的那样，制作唯一身份证会更容易。

Answer 7

同一页面中的ID不能两次，因此您可以使用备用选项，例如name或rel

$("div[rel=chng]").click(function() {
   var myClass = $(this).attr("class");
   alert(myClass);
});

将id更改为html代码中的rel

<div rel="chng" class="a"></div>
<br/>
<div rel="chng" class="b"></div>
<br/>
<div rel="chng" class="c"></div>
<br/>
<div rel="chng" class="d"></div>

希望它能够运作

如何在点击时获得具有特定ID的div类？

7 个答案: