php - 在单独的 div 中显示多个 MySQL 记录

Question

我正在尝试创建一个自动建议系统来查询 MySQL 并在用户键入时向他们显示可能的选项。一切正常，直到单击其中一个选项。当通过 jQuery 发出警报时，将传递包含所有查询记录的文本 block ，而不仅仅是被单击的记录。

这是 PHP:

$query=$conn->query("SELECT * from Customers where Phone like '%$searchq%' limit 10") or die($conn->error);

while($row = mysqli_fetch_array($query)) {

$fname = $row['FName'];
$lname = $row['LName'];
$add01 = $row['Address 01'];
$add02 = $row['Address 02'];
$suburb = $row['Suburb'];
$state = $row['State'];
$pcode = $row['Postcode'];
$phone = $row['Phone'];
$email = $row['Email'];

$output.= '<div name="firstdiv" class="redata" style="width:auto;text-align:left;text-decoration:none;color:black;">'.$phone.' '.$fname.' '.$lname.' '.$add01.' '.$add02.' '.$suburb.' '.$state.' '.$pcode.' '.$email.'</div>';

echo $output;

$mysqli->close;

$output 然后被发送到以下 html:

<div name="seconddiv" class="seconddiv" id="seconddiv" style="height:auto;width:auto;margin-top:60px;float:left;font-family:Verdana;font-size:14px;color:black;position:absolute;display:none;z-index:10000;border-radius:7px;border:1px solid navy;background-color:rgba(184,204,228,0.3);padding:7px;">
<div name="thirddiv" class="thirddiv" id="thirddiv" style="height:auto;width:auto;text-decoration:none;text-align:left;color:solid black;border:2px solid red;"></div>

然后通过以下 jQuery 发出警报:

$('#thirddiv').click(function()  {
clientdets = $('#thirddiv').text(); 
alert(clientdets);
});

最后，我得到的结果连接了所有记录，并将它们全部显示在警报消息框中的一大块中。

我需要的是能够单击单个 div，并且仅提醒该 div 的内容，而不是全部内容。

为了我日益减少的头发，任何帮助将不胜感激，在过去的几天里我一直在为此拔掉头发。

Answer 1

据我了解，你有一个类似这样的 html 结构:

<div id="thirddiv">
   <div>text example 1</div>
   <div>text example 2</div>
   <div>text example 3</div>
   ...
</div>

您的事件处理程序应该重写为如下所示:

$("#thirddiv").find("div").on("click", function()  {
   clientdets = $(this).text(); 
   alert(clientdets);
});

请注意，我在这里使用了 id 属性而不是 name 属性。

顺便说一句，应该避免内联样式。请改用单独的 CSS 样式表。