javascript - PHP OnClick 返回未定义

Question

我有一个 while 循环来构建数据表和 onclick 我想调用一个函数但是当我调用该函数时它没有从正在传递的 onclick 获取信息。

HTML:

echo "<td width='25%' align='center'><a href='javascript:void(0)' id='{$row['id']}' class='{$row['status']}' onclick='hello()'> {$row['status']} </a></td>";

JS:

//onclick function
function hello()
{
   // Get the ID of the button that was clicked on
   var id_of_status_to_update = $(this).attr("id");
   var status_to_be_updated = $(this).attr("class");
   var varData = 'id=' + id_of_status_to_update + '&UserStatus=' + 
   status_to_be_updated;
   console.log(varData);

   // Make an AJAX request
   $.ajax({
      url: "php/processor.php", //This is the page where you will handle your SQL insert
      type: "POST",
      data: varData, //The data your sending to processor.php
      async: false, 
      success: function(){
          // location.reload();
          alert("Hello Function");
      },
      error: function(){
          alert("There was a problem, please try again or contact the admin for assistance.");
      }   
    });
};

但是当我检查控制台日志时，我看到 id 和 userstatus 是未定义的，而不是应该传递的 id 和 class 属性。有什么帮助吗？我知道该函数正在被正确调用，因为我收到了成功警报。

Answer 1

要解决您未定义的问题，删除古老的 onclick 方法，并使用适当的 jquery .click 事件处理程序，然后您对 $(this) 的使用将起作用

首先将您的 html 构建调整为:

echo "<td width='25%' align='center'><a href='#' id='{$row['id']}' class='clicker {$row['status']}'> {$row['status']} </a></td>";

然后将 javascript 稍微调整一下:

$(document).ready(function() {
    $(".clicker").click(function(e){
        e.preventDefault(); // new line to stop the anchor click default behavior
        var id_of_status_to_update = $(this).attr("id");
        var status_to_be_updated = $(this).attr("class");
        // ... the rest you had is fine as is ...
    });
});

这会将点击事件处理程序附加到“clicker”类，因此它适用于该类的所有按钮。