0

我有这个代码：

while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
    if($i++%2==0){
       $color="#FFFFFF";
    }else{
       $color="#CCCCCC";
    }

    ?>

    <tr bgcolor='<?php echo $color; ?>' onmouseover="this.style.background='#ABFB04';" onmouseout="this.style.background='<?php echo $color; ?>';">
    <?php

echo "<td class=tablelist>";

echo $row["ICAO"] . '</td><td class=tablelist>';

echo $row["Name"] . '</td><td class=tablelist>';

echo $row["WeightEmpty"] . '</td><td class=tablelist>';

echo $row["WeightFull"] . '</td><td class=tablelist>';

echo $row["CargoFull"] . '</td><td class=tablelist>';

echo $row["Range"] . '</td><td class=tablelist>';

echo $row["Price"] . '</td><td class=tablelist>';

echo $row["FirstClassSeats"] . '</td><td class=tablelist>';

echo $row["BusinessClassSeats"] . '</td><td class=tablelist>';

echo $row["EconomyClassSeats"]. '</td><td class=tablelist>';

echo "<img id='editaircraft' src='./images/info.png'></td></tr>"; 

?>
<script>
    $(function() {
        $( "#editaircraftdialog" ).dialog({
            autoOpen: false,
            width: 425
        });

        $( "#editaircraft" ).click(function() {
            $( "#editaircraftdialog" ).dialog( "open" );
            return false;
        });
    }); 
</script>

<div id="editaircraftdialog" title="Edit Aircraft">
    <p>Hello World!!</p>
</div>

<?php
}

echo "</table>";
$pagination->render();
?>

它是 PHP 表格行的内容。当我在表格的任何行中单击图像 info.png 时，我想要它显示 JQuery 对话框“editaircraftdialog”。

有了这个代码。当我单击第一行的图像时，我只会看到对话框。如果我点击第二个或其他不是第 1 行的，它不会显示对话框。

4

3 回答 3

1

Try this

<?php
while ($row = mysql_fetch_array($result, MYSQL_ASSOC)){
    if($i++%2==0){
       $color="#FFFFFF";
    }else{
       $color="#CCCCCC";
    }

    ?>

    <tr bgcolor='<?php echo $color; ?>' onmouseover="this.style.background='#ABFB04';" onmouseout="this.style.background='<?php echo $color; ?>';">
    <?php

echo "<td class=tablelist>";

echo $row["ICAO"] . '</td><td class=tablelist>';

echo $row["Name"] . '</td><td class=tablelist>';

echo $row["WeightEmpty"] . '</td><td class=tablelist>';

echo $row["WeightFull"] . '</td><td class=tablelist>';

echo $row["CargoFull"] . '</td><td class=tablelist>';

echo $row["Range"] . '</td><td class=tablelist>';

echo $row["Price"] . '</td><td class=tablelist>';

echo $row["FirstClassSeats"] . '</td><td class=tablelist>';

echo $row["BusinessClassSeats"] . '</td><td class=tablelist>';

echo $row["EconomyClassSeats"]. '</td><td class=tablelist>';

echo "<img id='editaircraft".$i."' src='./images/info.png'></td></tr>"; 

?>
<script>
       $( "#editaircraft<?php echo $i; ?>" ).click(function() {
            $( "#editaircraftdialog" ).dialog( "open" );
            return false;
        });
</script>
<?php
}

?>

<script>
    $(function() {
        $( "#editaircraftdialog" ).dialog({
            autoOpen: false,
            width: 425
        });


    }); 
</script>

<div id="editaircraftdialog" title="Edit Aircraft">
    <p>Hello World!!</p>
</div>

<?php
echo "</table>";
$pagination->render();
?>
于 2013-01-07T17:09:10.073 回答
1

问题可能是重复的 HTML 元素 ID，就像 vimalnath 所说的 ID 总是唯一的。如果你有两行（或更多），你最终会得到两个具有相同 ID 的元素，因此使用的 jQuery 选择器只会选择第一个元素。

将 ID 替换为类，如下所示：

echo "<img class='editaircraft' src='./images/info.png'></td></tr>";

jQuery 选择器看起来像这样：

 $( ".editaircraft" ).click(function() {

使用诸如http://validator.w3.org/之类的 HTML 验证器总是一个好主意。重复的 ID 应被验证器视为错误。

于 2013-01-07T17:02:22.967 回答
0

您需要使用class而不是id. Id' 在 CSS 中总是唯一的。

W3C 将类 ID 定义为“一个元素的唯一标识符。一个类可以多次使用，而一个 ID 只能使用一次，因此您应该将类​​用于您知道会经常使用的项目。一个例子是，如果您想为网页上的所有段落提供相同的样式，您将使用类。

于 2013-01-07T16:58:29.393 回答