我想显示一个jQuery对话框，其中包含表中一行的详细信息（只显示部分信息）。这是我想做的一个例子
问题是：当点击一行的"查看更多详细信息"图像时，JS函数会收到点击行的id。我不能像在代码的HTML部分那样为JS变量"data"赋值。我该如何解决这个问题？这是一个好方法吗？
<script>
$(function() {
$( "#dialog" ).dialog({
autoOpen: false,
height: 400,
width: 600,
buttons: [{
text: "Close",
click: function() {
$(this).dialog("close");
}
}]
});
$(".details").click(function(){
$("#dialog").empty();
var i = $(this).attr('id');
var data = <?=$cars[i]['price']?>;
$("#dialog").append("<p>Car:"+data+"</p>");
$("#dialog").dialog("open");
});
});
</script>
<table>
<?php for($i = 0; $i < count($cars); $i++) { ?>
<tr>
<td><?=$cars[$i]['model']?></td>
<td><?=$cars[$i]['colour']?></td>
<td>
<img class="details" id="<?=$i?>" style="cursor: pointer;" src="http://localhost/ci/public/images/details.png" width="40" height="40" alt="Details"/>
</td>
</tr>
<?php } ?>
</table>
有很多方法可以实现这一点，其中包括：
1） 如果数据是动态的，则使用Ajax
2） 如果是静态的，则可以使用以下任何一种-
-
a） 存储php-array-info-js-array并使用Key检索它，方法是将数组键设置为行id，并在行的onClick上从数组中获取数据。
-
b） 如果你想避免阵列，那么-
- i） 使用需要为每一行显示的信息创建唯一的div。默认情况下，单击取消隐藏并显示为对话框
- ii）创建一个带有参数的js函数，并使用作为参数传递给它的信息在其中启用对话框。对于每一行，通过将信息作为参数传递，在onClick事件上调用此函数
您试图使用客户端服务器上的数据，而不使用任何代码将其发送到客户端。您必须有一种方法将数据从php获取到javascript。这里有一个替代方案，它使用HTML数据属性。
在你的图像标签中这样做：
<img class="details" id="<?=$i?>" data-price="<?=htmlentities($cars[$i]['price'])?>" style="cursor: pointer;" src="http://localhost/ci/public/images/details.png" width="40" height="40" alt="Details"/>
这只是以客户端可以轻松读取的形式保存了一些数据。htmlentities只是为了安全起见，以防变量包含引号字符（有意或无意）
我应该指出，在这一点上没有明确需要id属性，除非您将其用于其他用途。
然后，您可以将您的点击功能更改为以下内容（根据我的想法，未经测试，请参阅.data()的文档）：
$(".details").click(function(){
$("#dialog").empty();
var data = $(this).data('price');
$("#dialog").append("<p>Car:"+data+"</p>");
$("#dialog").dialog("open");
});