Question

我可能忽略了一些非常明显的东西，但此时我投降并需要帮助。

这是我的情况。当我的页面加载时，在一个while循环中，PHP会生成一个包含来自我的服务器的数据的表。每个表行都有一个名称列，电话等。其中一列是一个图标，单击该图标时，用户可以查看带有此特定潜在客户注释的弹出窗口。简单的东西。

每行中的图标具有相同的类名，其ID是唯一的。

我有一个AJAX请求，应该从服务器提取笔记数据，并在用户点击相对图标时在弹出窗口中显示。我正在尝试使用$（'。class'）。click（this）.attr（'id'）;使用需要提交给我的PHP脚本的id在我的AJAX请求中设置变量。

问题：AJAX请求和返回似乎工作正常，但无论我点击哪个行图标，它只显示属于第一行的数据，或者第一个具有类名称'homelead'的实例：示例：I点击第1行图标，我得到一个带有第1行注释的弹出窗口，太棒了！我点击任何其他行，它只显示第一行数据，:(。我已通过简单点击确认与每行图标相关联的ID是正确的。（this）。（id）并警告属于的ID行图标。一切正确，似乎无法使用正确的ID更新JS变量。

我很困惑为什么会这样。任何帮助，将不胜感激。这是我目前的代码。

HTML：

 <td>
       <img class="homelead" id="<?php echo $leadsfetch['unit_id'];?>"  
           onclick="ajax_unitnotes();" src="images/list-view.png">
  </td>
  <?php echo "</tr>"; } ?>

AJAX请求：

function ajax_unitnotes(){

    var hr = new XMLHttpRequest();
    var url = "PHP/getnotes.php";

   // this variable should update with clicked rows id before      submitting to PHP script
    var unitidnotes = $('.homelead').click(this).attr('id');     

    var vars = "unitidnotes="+unitidnotes;
    hr.open("POST", url, true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var return_data = hr.responseText;
            document.getElementById("unitnotes").innerHTML = return_data;
        }
    }
    hr.send(vars); 
    document.getElementById("unitnotes").innerHTML = "processing...";
}

Answer 1

当你在标签本身使用onclick触发器时 - 这在使用jQuery时通常是不常见的。你可以这样做：

 <img class="homelead" id="<?php echo $leadsfetch['unit_id'];?>"  
           onclick="ajax_unitnotes($(this));" src="images/list-view.png">

你的功能

function ajax_unitnotes(e){

    var unitidnotes = e.attr('id');
}

您当前的代码

var unitidnotes = $('.homelead').click(this).attr('id');

实际上不知道您要访问的this对象是什么。

更好的是，您可以使用jQuery事件，从img标记中删除onclick并进行如下事件：

$('.homelead').click(function(){
    id = $(this).attr('id');
});

Answer 2

您可以将点击的对象this传递给＆＃34; onclick＆＃34;触发的功能：

onclick="ajax_unitnotes(this);"

这将使你点击的DOM对象在JS函数中可用。

您需要相应地更改功能签名：

function ajax_unitnotes(clickedElement){

然后你可以改变这个

var unitidnotes = $('.homelead').click(this).attr('id');

到

var unitidnotes = clickedElement.id;

这将为您提供$leadsfetch['unit_id'] = img id。

的值

单击

2 个答案: