jquery - how to use javascript onclick event handler for same class of anchor elements -


this javascript:

here grab data using ajax request , call function:

function fetch_user_data(data) {      $(user_board['results']).each(function(attributes,value){          $('.main_container').append(             '<div class="pin" id='+attributes+'>\                 <div class="holder">\                     <a class="image" href="" title="photo number 1" pin_id='+ attributes +'>\                         <img src="'+ value['profile'] + '" />\                     </a>\                 <p class="desc">' + value['name'] + '</p>\                 <ul id="pin_actions">\                     <li id="awe"><a href="#" onclick="ontabaction('+value['user_id']+'); return false;"></a></li>\                     <li id="cof"><a href="#" onclick="ontabaction('+value['user_id']+'); return false;" ></a></li>\                     <li id="ban"><a href="#" onclick="ontabaction('+value['user_id']+'); return false;" ></a></li>\                 </ul>\             </div>'         );      }); }  function ontabaction(id,action) {      console.log(id);     console.log(action);  } 

here problem, data contains 33 objects, , according object there 33 html boxes belong person profile. attached onclick event handler in anchor tag , user id through custom function ontabaction. along id want string like: ontabaction('+value['user_id']+',actionstr) when call function , print output in console.log: prints user id once , string equal object quantiy li#actionstr. in short both string , id , make url query on other url. please me on stuff, if string , id have remove anchor main page place anchor on other page.

here working example, code posted can't make working example because of missing:

<!doctype html> <html>  <head> <meta content="text/html; charset=utf-8" http-equiv="content-type"> <title>example</title> <style type="text/css"> .clickable{   cursor:pointer; } </style> <script type="text/javascript" src="jquery-1.9.0.js"></script> <script type="text/javascript"> $(document).ready(function(){     var somedata=["one","two","three"],     i=0,     user_id="my user id",     $main=$('.main_container');     for(i=0;i<somedata.length;i++){         $main.append(                 "<h1>"+somedata[i]+"</h1>\                 <ul id=\"pin_actions\">\                     <li class=\"clickable\" data-action='awe'>awe</li>\                     <li class=\"clickable\" data-action='cof'>cof</li>\                     <li class=\"clickable\" data-action='ban'>ban</li>\                 </ul>"         );     }     $main.attr("data-userid",user_id);     //attach onclick     $('.main_container').find("li").on("click",ontabaction); }); function ontabaction(e) {     console.log("userid:",this.parentelement.parentelement.getattribute("data-userid"));     console.log("action:",this.getattribute("data-action")); } </script> </head>  <body>    <div class="main_container">    </div>  </body> </html> 

Comments

Popular posts from this blog

php - Why I am getting the Error "Commands out of sync; you can't run this command now" -

linux - Does gcc have any options to add version info in ELF binary file? -

java - Are there any classes that implement javax.persistence.Parameter<T>? -