如何确定在哪个 div/class 中单击了按钮答案

【问题标题】：How to determine which div/class a button has been clicked in如何确定在哪个 div/class 中单击了按钮
【发布时间】：2011-12-15 11:17:46
【问题描述】：

这是我的 ajax 帖子

<script language="JavaScript" type="text/javascript">
  var num = 1;
  function ajax_post(){
  // Create our XMLHttpRequest object
  var hr = new XMLHttpRequest();
  // Create some variables we need to send to our PHP file
  var url = "javas.php";
  hr.open("POST", url, true);
   // Set content type header information for sending url encoded variables in the request
  hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  // Access the onreadystatechange event for the XMLHttpRequest object
  hr.onreadystatechange = function() {
  if(hr.readyState == 4 && hr.status == 200) {
        var return_data = hr.responseText;
        document.getElementById("status").innerHTML = return_data;
    }
}
// Send the data to PHP now... and wait for response to update the status div
hr.send("num=" + (++num)); // Actually execute the request
document.getElementById("status").innerHTML = "processing...";

}
</script>

现在我需要确定单击按钮的哪个类别（在 php 中）

<?php
   //Getting posts from DB
   $event1 = mysql_query("SELECT post,date,memid FROM postaction WHERE memid = '$id' ORDER  BY date DESC LIMIT 5;");
  while ($row1 = mysql_fetch_array($event1))
  {
       $event = $row1['post'];
       $timeposted = $row1['date'];
       $eventmemdata = mysql_query("SELECT id,firstname FROM users WHERE id = '$id' LIMIT 1");
        while($rowaa = mysql_fetch_array($eventmemdata))
        {
            $name = $rowaa['firstname'];
            $eventlist = "$event <br> $name";
    }
        echo " <div id = 'eventer'> $timeposted <br>$eventlist</div> <input name='myBtn'            type='submit' value='increment' onClick='javascript:ajax_post();'>
               <input name='lol' type='submit' value='dec' onClick='javascript:ajax_posta();'>
               <div id = 'status'>lol</div>";
        echo "<br>";
  }
?>
</span>
</div>

单击按钮时，将调用 ajax 函数，但该函数显示在第一个状态 div 中，而不是单击按钮所在的 div/class 中。

【问题讨论】：

标签： php javascript jquery css ajax

【解决方案1】：

首先，您需要意识到标签的“id”属性应该是唯一的。因此，实现这一点的正确方法是区分 ID，例如向它们附加唯一编号。有点像这样：

$i = 0;
while ($row1 = mysql_fetch_array($event1))
{
   $i++;

   ...

   echo " ... <input type='submit' name='lol' value='dec$i' />
       <div id='status$i'>...</div>";
}

然后您可以检查命令后得到的数字（我知道这是粗略的）

【讨论】：

不要样式化 ids，样式类，那些不需要是唯一的

【解决方案2】：

使用 jQuery 找出哪个按钮被点击了。为您的按钮添加名称属性。

    $().function({
      $("some_button").click() {
      clicked_name = $(this).attr("name");
      }
    });

【讨论】：

它们都是同一个按钮，我试图找出它被点击的哪个类
与其试图找出按钮被点击的类别，不如尝试找出按钮本身被点击。您可以通过给每个按钮一个独特的属性来区分您的按钮。找到确切的原点（即您的按钮）总是比找出该按钮的位置更好:)

【解决方案3】：

您可以使用一些相关数据更新隐藏字段并在帖子中检查它..

【讨论】：

【解决方案4】：

而不是

 echo " <div id = 'eventer'> $timeposted <br>$eventlist</div> <input name='myBtn'            type='submit' value='increment' onClick='javascript:ajax_post();'>
               <input name='lol' type='submit' value='dec' onClick='javascript:ajax_posta();'>
               <div id = 'status'>lol</div>";
        echo "<br>";

使用

  echo " <div id = 'eventer'> $timeposted <br>$eventlist</div> <input name='myBtn'            type='submit' value='increment' onClick='javascript:ajax_post();'>
               <input name='lol' type='submit' value='dec' onClick='javascript:ajax_posta(this);'>
               <div id = 'status'>lol</div>";
        echo "<br>";

在 javascript 中，您可以在收到对象后使用整个对象轻松获取点击了哪个对象，您可以使用数据属性或使用索引

【讨论】：