使用jquery追加函数后访问jquery元素

时间:2017-01-20 05:48:31

标签: javascript php jquery ajax

当我访问点击事件时,如何使用jquery获取<a>标记的点击事件,请不要加入。请

这是我使用追加方法

添加数据的脚本
$.ajax({
  type: "POST",
  url: URL,
  data: datastring
}).done(function(data) {

  var status = JSON.parse(data);
  for (var i in status) {
    $("#loadmystatus").append(
      "<div style='float: right; margin-top: 5px;'>" +
      "<label style='font-weight: 500;' class='lblsizr'>2:45 am 02/04/2016</label>" +
      "<div class='dropdown user-menu' style='margin-right: 16px;'>" +
      "<button class='iconsiz' id='dd-user-menu' type='button' data-toggle='dropdown' aria-haspopup='true' aria-expanded='false'>" +
      "<img src='image/icon/menu option.png' alt='' style='height: 6px; margin-left: 8px;'>" +
      "</button>" +
      "<div class='dropdown-menu dropdown-menu-right' aria-labelledby='dd-user-menu'>" +
      "<a class='make dropdown-item' name='make' id='make'>" +
      "<span class='font-icon glyphicon glyphicon-thumbs-up'></span>" +
      "Make current status" +
      "</a>" +
      "<a class='dropdown-item' href='#'>" +
      "<span class='font-icon glyphicon glyphicon-remove'></span>" +
      "Remove" +
      "</a>" +
      "</div>" +
      "</div>" +
      "</div>" +
      "<br>" +
      "<div style='border-radius: 10px;'>" +
      "<label>" + status[i].userstatus + "</label>" +
      "</div>" +
      "<hr>"
    );
  }
});

这是我访问标签的scritp,即使没有工作

<script type="text/javascript">
$(document).ready(function()
{
   $('#make').on('click', function(event) {
   alert("hello");
});
});

请帮忙

1 个答案:

答案 0 :(得分:2)

您将事件处理程序附加到尚未创建的元素。

要解决您的问题,您可以将事件处理程序附加到document#loadmystatus,如Sergio在评论中所建议的那样。

$(document).on('click', '#make', function(event) {
   alert("hello");
});

$('#loadmystatus').on('click', '#make', function(event) {
   alert("hello");
});

$(document).on("click", "#make", function(e){alert('test')});
$("#loadmystatus").append("<button id='make'>Click me!</button>");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="loadmystatus"></div>