想要为每个数据库ID使用foreach使用jquery对话框

Question

我想为每个数据库行使用JQuery对话框。

我的问题是，当我想点击一些东西。所有对话框将打开，每个ID为Image。我希望点击时只显示特定的ID。 我从来没有真正与JQuery合作过，我搜索了很多，但我只是想出了如何解决这个问题。

我的代码：

查询。

<?php 
    include ('functions/function.php'); 
    $connect = connectToDB(); 

$query = "SELECT `MaasduinId`, `MaasduinImage`, `MaasduinNaam`, 
`MaasduinLocatie`, `MaasduinTelefoon`, `MaasduinEmail`, `MaasduinWebsite`, 
`MaasduinWelkom`, `MaasduinArrangement`,`MaasduinPasfoto` ,`MaasduinPas`, 
`MaasduinCategory` FROM `maasduinen` WHERE 1=1"; 

$resource = mysqli_query($connect, $query); 

$hotels = array(); 

while($result = mysqli_fetch_assoc($resource)) 
{ 
$hotels[] = $result; // all your games are now in array $games 
} 


?> 

对于脚本每个循环中

   foreach($hotels as $key => $hotel) 
       { 
        ?> 
        <?php if ($hotel['MaasduinCategory'] == 'Appartementen'): ?> 

          <div class="products-<?php echo $hotel['MaasduinId'];?>"> 
           <div class="maasduin-foto"><img style="width: 136px; height: 134px;" src="\Maasduinen-NW\image\<?php echo $hotel['MaasduinImage']; ?>"> 
            <?php if ($hotel['MaasduinPas'] == '1'): ?> 
             <div class="maasduin-actiefoto"> 
              <img style="width: 40px; height: 40px;" src="\Maasduinen-NW\image\<?php echo $hotel['MaasduinPasfoto']; ?>"> 
             </div> 
            <?php endif ?> 
           </div> 
           <div class="maasduin-naam"><?php echo 
           $hotel['MaasduinNaam']; ?></h3></div> 
           <div class="maasduin-locatie"><?php echo 
           $hotel['MaasduinLocatie']; ?></div> 
           <div class="maasduin-email"><?php echo 
            $hotel['MaasduinEmail']; ?></div> 
           <div class="maasduin-telefoon"><?php echo 
            $hotel['MaasduinTelefoon']; ?></div> 
           <div class="maasduin-website"><?php echo 
            $hotel['MaasduinWebsite']; ?></div> 
        <script> 
          var $dialog; 
          $(document).ready(function() { 
           $dialog = $("div[class^='test-']") 

           .dialog({ 
            autoOpen: false, 
            title: '<?php echo 
            $hotel['MaasduinNaam']; ?>' 
           }); 

           $("div[class^='products-']").click(function() { 
            $dialog.dialog('open'); 
            return false; ////cancel eventbubbeling 
           }); 
          }); 

          function showDialog() { 
           $dialog.dialog('open'); 
           return false //cancel eventbubbeling 
          } 

        </script>  

试验 - 格

<?php foreach($hotels as $key => $hotel) 
       { 
        ?> 
           <div class="test-<?php echo 
            $hotel['MaasduinId'];?>"> 
            <div class="maasduin-naam"><?php echo 
             $hotel['MaasduinNaam']; ?></h3></div> 
           </div> 

      <?php } ?> 

Answer 1

问题就在这里：

$dialog = $("div[class^='test-']") 

在这里，您将选择以test-开头的所有div's，并初始化其对话框。而不是这样做，通过给它们提供一个唯一的id来选择特定的div，并将对话框初始化代码放在那个id上。像：

<div class="click_div" id="<?php echo 
    $hotel['MaasduinId'];?>"><?php echo 
    $hotel['MaasduinNaam']; ?></h3> 
</div> 

$(".click_div").on("click",function(e){ 
    // $(this).attr('id') will return the id 
    $dialog = $(this).attr('id'); 
    $dialog.dialog('open'); 
}); 

Answer 2

使用在每格但相同的类名ID将有所不同： - 在你的阙ID将MaasduinId

<?php foreach($hotels as $key => $hotel) 
       { 
        ?> 

            <div class="click_div" id="<?php echo 
            $hotel['MaasduinId'];?>"><?php echo 
             $hotel['MaasduinNaam']; ?></h3></div> 


      <?php } ?> 



<script> 
$(".click_div").on("click",function(e){ 
    alert($(this).attr('id')); 

}); 
</script>