如何使用jquery从div内部获取id

Question

How to get the id from the inside div. I have many div with class control but I want to get parent div id. How to get?

http://jsfiddle.net/cngt2ef6/7/

 $(".getid").click(function() { alert($(this).closest('div').hasClass("control).attr("id")) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="control" id="spa"> Content </div> <div class="control" id="test"> <div class="method"> <a href="#" class="getid">Getid</a> </div> </div> <div class="control" id="awesome"> Content </div> 

Answer 1

The problem comes from :

1. The closest selector that will return the first parent div (what is not what we need here).
2. The hasClass() since it will return a boolean if the element has the given class or not. (in your case the first parent doesn't have the given class control )

Instead of using hasClass() you need to use the class selector directely in the closest() method like:

$(this).closest('div.control').attr("id");

 $(".getid").click(function() { console.log($(this).closest('div.control').attr("id")); }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="control" id="spa"> Content </div> <div class="control" id="test"> <div class="method"> <a href="#" class="getid">Getid</a> </div> </div> <div class="control" id="awesome"> Content </div> Js: 

Answer 2

Besides closest() - which return the first single node parent - already mentioned you can use parents() , but in this case will return multiple nodes with the element/class/id targeted.

It is just an alternative to closest() in this case scenario

 $(".getid").click(function() { console.log($(this).parents('.control').attr("id")) }) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="control" id="spa"> Content </div> <div class="control" id="test"> <div class="method"> <a href="#" class="getid">Getid</a> </div> </div> <div class="control" id="awesome"> Content </div>