结合div ID和this.ID

Question

Maybe isn't good title for the question but my problem is exactly this. I have several DIV tags on the page and all of them start as #result and continue with number <div id="result22"> , <div id="result33"> etc. Now I'm find some nice jQuery things to do and it works as expected but the only problem is how to add known number to the #result here is the code:

<script type="text/javascript">
   $(document).ready(function() {
     $('.like').bind('click', function () {
       $.get("/sng_like/"+this.id+"/", function(data) {
         $('#result')[0].innerHTML=data;
     });
   });
 });
</script>

I want that value of this.id to be a part of the #result to get #result22 for example. My JS knowledge is limited and I was already try $('#result'+this.id)[0].innerHTML=data; but it wont work.

Thanks, G

Answer 1

$(document).ready(function() {
     $('.like').bind('click', function () {
       var item=$(this);
       $.get("/sng_like/"+item.attr("id")+"/", function(data) {
         $('#result'+item.attr("id")).html(data);
     });
   });
});

As of jQuery 1.7, the .on() method is the preferred method for attaching event handlers to a document. So you may consider using that.

If you are using 1.7+ version, your code can be rewritten to use on function like this

$(function(){
   $(document).on("click",".like",function(){
       var item=$(this);           
       $.get("/sng_like/"+item.attr("id")+"/", function(data) {
          $('#result'+item.attr("id")).html(data);
       });
   });
});

$(function() is a short form of $(document).ready(function()

Answer 2

你可以说：

$.get("/sng_like/"+$(this).attr("id")+"/", function(data)

Answer 3

<script type="text/javascript">
   $(function() {
       $('.like').on('click', function() {
           var MyId=this.id;
           $.get("/sng_like/"+MyId+"/", function(data) {
               $('#result'+MyId).html(data);
           });
       });
   });
</script>