Javascript 如何在jQuery中获取元素的id？_Javascript_Jquery

Javascript 如何在jQuery中获取元素的id？

javascript jquery

Javascript 如何在jQuery中获取元素的id？,javascript,jquery,Javascript,Jquery,我是jQuery新手，目前正在尝试获取页面中已单击元素的id 据我所知，我知道我们可以通过使用$（this.attr（“id”）但是我没有得到id，而是说undefined HTML代码： <html> <body> <form action="#"> <a href='#' id="1st">First</a></br> <a href='#'

我是jQuery新手，目前正在尝试获取页面中已单击元素的

id

据我所知，我知道我们可以通过使用

$（this.attr（“id”）
但是我没有得到id
，而是说undefined

HTML代码：
<html>
    <body>
        <form action="#">
            <a href='#' id="1st">First</a></br>
            <a href='#' id="2nd">Second</a></br>
            <p id='3rd'>Test text</p>
        </form>
        <script type="text/javascript" src="jquery.js"> </script>
        <script type="text/javascript" src="code.js"> </script>
    </body>
</html>

$(document).click(function(){
    alert($(this).attr("id"));
    });

以下代码如何完美地返回id：
$(document).click(function(event){
    alert(event.target.id);
    });

有人能解释一下为什么会这样&我误解了什么？谢谢。
正如Jason p在评论中指出的那样，您正在将.click（）
事件绑定到$（文档）
，因此所有对$（此）
的引用都将引用$（文档）
。由于您正在请求$（document）
的id，您将得到一个未定义的错误，因为没有id
如果您试图获取
的id，则需要将绑定到该id。单击（）
$("a").click(function(){
     alert( $(this).attr("id") );
});

$（this）
现在指的是

请注意，这会将.click（）
事件附加到每个中，因为$（此）
指的是文档（事件绑定到的内容）。回调中的event.target参数引用了已单击的元素
如果要将它与.attr（）
结合使用，可以将事件.target
包装到jquery对象，并调用attr（'id'）

参见JSFIDLE：
附言：你们在这里看到的与事件冒泡有关。见：和
简而言之：event.target
指的是您单击的元素，它指的是您将事件绑定到的元素。

<script>
$(document).ready(function() {

   $(".well").mouseenter(function(e) {
        alert($(this).attr("id"));
    });

  });

</script>

<div class="container">
<h2 class="text-info"> Check</h2>
        <div class="well" id="first">
            <a href='#' id="1st" class="text-warning">First</a></br>
            <a href='#' id="2nd">Second</a></br>
        </div>
</div>

$（文档）.ready（函数（）{
$（“.well”）.mouseenter（函数（e）{
警报（$（this.attr（“id”））；
});
});
检查





这里$this指的是绑定到某个dom元素的任何事件，如mouseenter、click、mouseup等，您可以使用任何类、id或任何属性选择该元素
和$this，它绑定事件和dom以撤销被调用的请求。这里是id-dom元素，类为：“well”
现在，如果你包括，第二个div和同一个类。像
<div class="well" id="second">
            <a href='#' id="1st" class="text-warning">First</a></br>
            <a href='#' id="2nd">Second</a></br>
</div>







每个类都将使用其dom检查发生的事件。因此，事件和选择器都应该匹配以给出所需的结果，$this绑定两者并相应地读取以给出结果
在第二种情况下，当您将鼠标移到第二个div上时，它将再次发出警报
 您正在将事件处理程序绑定到文档
，因此此
引用文档
，而文档
没有id
。顺便说一句，此.id
与$（this.attr（'id'）的工作原理一样好，并且速度略快
@JasonP如果我执行了
，那么当我单击页面时，第二个jquery脚本将返回我的mainpage
。但是第一个jquery代码仍然返回未定义的。这是因为
包含在jquery事件处理程序中的文档中@ρss中，这个引用处理程序绑定到的元素（在本例中，文档
）event.target
总是指作为事件初始目标的元素。可能最好使用$（“a”）。单击（）
，而不要让他与事件混淆。target
。可能是一种解决方案-是的，因为我不确定整个练习的目标是什么，我决定以足够精确的方式回答他的问题-他主要是为了解释为什么$（this）.attr（“id”）不起作用。如果我点击段落文本，这个解决方案将不起作用！我不是在寻找这个解决方案。谢谢。然后将。click（）
事件绑定到$（“p”）
，或者如果您担心绑定。click（）
使用$（“*”
）绑定到所有内容。或者更好地使用bind。click（）
绑定到$（“[id]”）上，这会将事件绑定到任何具有id的元素。是的，现在您给出了一个很好的解决方案。请看一下我对杰森的评论。你能澄清我的疑问吗？我想我无法解释得比Jason解释得更清楚了“在jQuery事件处理程序中，$（this）指的是处理程序绑定到的元素（在本例中为document）。event.target始终指的是事件的初始目标元素。”谢谢，在我的第一个jquery代码中，$（this）指的是谁？$（this）在第一种情况下无法绑定任何目标以显示请求的输出。在第二种情况下，event.target总是指触发事件的元素
<div class="well" id="second">
            <a href='#' id="1st" class="text-warning">First</a></br>
            <a href='#' id="2nd">Second</a></br>
</div>