如何根据查询结果“突出显示”div？

Question

我正在开发一款游戏的小应用程序。 该应用程序包含显示给定怪物在哪里。我有一个怪物，地图和地图的怪物所属的数据库。

现在应用程序几乎可以工作，例如，如果用户编写“Poring”，则html中的列表将显示地图名称和地图ID。

无论如何，我还有一个与整个游戏世界的网格，网格中的每个方格都是一个地图，并且每个网格都有一个特定的ID。

因此，可以说我正在寻找应用程序中的“Poring”。

现在它会显示以下列表：

map: Prontera Field 07 map_id: prt_fild07 
map: Prontera Field 08 map_id: prt_fild08 

，但我要的是不要表现出名单，但突出的div（或添加任何CSS），以的div id为” prt_fild07“和id =”prt_fild08“。

我知道我需要使用AJAX，但我不知道如何，因为我正在学习JQuery，但无论如何，现在我正在使用AJAX来显示列表。

这里是jQuery代码：

$('#ro-form').submit(function(e){ 
     e.preventDefault(); //Prevent default submission 

     $.ajax({ 
      url: 'files/php/process.php', 
      type: 'POST', 
      data: $(this).serialize(), //serielize form data 
      dataType: 'html' 
     }) 
     .done(function(data){ 
      $('#test').fadeOut('slow',function(){ 
       $('#test').fadeIn('slow').html(data); 
      }); 
     }) 
     .fail(function(){ 
      alert(':('); 
     }); 


    }); 

，这里是PHP的一部分

<?php 

    include 'connection.php'; 

    if($_POST){ 
     $mob_id_name = $_POST['mob_id_name']; 
    } 

    $sql = "select restartmap.map.map_name, restartmap.map.map_id 
      from restartmap.map, restartmap.map_monster, restartmap.monster 
      where restartmap.map.map_id = restartmap.map_monster.map_monster_map_id and 
        restartmap.monster.monster_id = restartmap.map_monster.map_monster_monster_id and 
        (restartmap.monster.monster_id = '$mob_id_name' 
        or restartmap.monster.monster_name like '$mob_id_name')"; 
    $result = $conn->query($sql); 

    $conn->close(); 
?> 


<div id="result-container"> 
    <?php 
     if($result->num_rows > 0){ 
      while($row = $result->fetch_assoc()){ 
       print "map: " . $row["map_name"] . " map_id: " .$row["map_id"] . "<br>"; 
      } 
     }else{ 
      print "<p> nothing :(</p>"; 
     } 


    ?> 
</div> 

基本上我做的是从index.php中的信息发送通过AJAX来process.php和然后在index.php中打印整个$ result var，但我真正想做的是突出显示与map_id具有相同id的div。

Answer 1

你可以改变你的jQuery代码接受json为dataType，像这样，比PHP使用parse_str解析出贴序列化的数据到一个数组，你可以工作，不仅仅是建立一个阵列，这将是返回参数中的.done jquery ajax函数。我在下面的php中使用$return，这个值只比json_encode这个值还可以使用。

像下面的东西应该很好地工作。但是你没有在这些div里面指定你想要的内容，所以我只是把Put something in here文本代替你需要的内容。

的jQuery：

$('#ro-form').submit(function(e){ 
    e.preventDefault(); //Prevent default submission 

    var $parentDiv = $('<div />').attr('id', 'result-container'); 

    $.ajax({ 
     url: 'files/php/process.php', 
     type: 'POST', 
     data: { 
      formData: $(this).serialize() 
     }, 
     dataType: 'json' 
    }) 
    .done(function(data){ 

     if (data.hasOwnProperty('msgids')) 
     { 
      for(var x = 0, len = data['msgids'].length; x < len; x++) 
      { 
       var $div = $('<div />').attr('id', data['msgids'][x]).text('Put something in here'); 
       $div.appendTo($parentDiv); 
      } 
      $('body').append($parentDiv); 
     } 
    }) 
    .fail(function(){ 
     alert(':('); 
    }); 


}); 

PHP：

<?php 

    $return = array(); 

    include 'connection.php'; 

    if(!empty($_POST['formData'])) 
    { 
     parse_str($_POST['formData'], $data); 

     $mob_id_name = $data['mob_id_name']; 

     $sql = "select restartmap.map.map_name, restartmap.map.map_id 
      from restartmap.map, restartmap.map_monster, restartmap.monster 
      where restartmap.map.map_id = restartmap.map_monster.map_monster_map_id and 
        restartmap.monster.monster_id = restartmap.map_monster.map_monster_monster_id and 
        (restartmap.monster.monster_id = '$mob_id_name' 
        or restartmap.monster.monster_name like '$mob_id_name')"; 
     $result = $conn->query($sql); 

     $conn->close(); 

     if ($result->num_rows > 0) 
     { 
      while($row = $result->fetch_assoc()){ 
       $return['msgids'][] = $row['map_id']; 
      } 
     } 

    } 

    echo json_encode($return); 
    die(); 

?>