Ajax调用以纯字符串格式返回数据。

在PHP中我可以做这样的事情：Ajax调用以纯字符串格式返回数据。

echo "<div>".$myvariable."</div>";

这将打印出我的div的HTML中为其标签的变量。不过最近，我需要使用jquery进行ajax调用。我对阿贾克斯有点熟悉，但我没有太多用处。无论如何，我运行ajax代码，它会将数据打印到我想要的HMTL元素框中，但是，div标签会随着内容本身一起打印并显示！

整个返回数据几乎是1个长字符串，而不是像我想要的那样解析我的数据。我哪里做错了？为什么它只返回1个长字符串？

PHP代码：

<?php 

require 'database.php'; 

$meal = $_POST['meals']; 

$meal_q = "SELECT item 
       FROM meal_ingredients 
       WHERE meal_name='$meal' 
       ORDER BY item"; 

$meal_c = $conn->query($meal_q); 
    while ($row = $meal_c->fetch_assoc()){ 
     $view_ingredient = $row['item']; 
     echo "<div>".$view_ingredient."</div>"; 
    }; 

?>

jQuery代码：

if($('body').hasClass('CreateMealPage')){ 

    $('tr').on('click', function(e){ 
     $('#sidebar').animate({right: '-200px'}, 500); 
     var meals = $(this).find('.meals').text(); 

     $.ajax({ 
      method: "POST", 
      url: 'meal_list.php', 
      data: {meals: meals}, 
      success: function(data) { 
      var sidebar = document.getElementById('sidebar'); 
      sidebar.innerHTML = ""; 
      sidebar.append(data); 
      } 
     }); 
    }); 

};

屏幕上显示内容提炼：

<div>ingredientname</div> 
<div>ingredientname</div> 
<div>ingredientname</div>

而不是：

ingredientname 
ingredientname 
ingredientname

来源

2017-10-28 Shawn

$（“＃sidebar.append（JSON.stringify（数据））; –

可以粘贴从网络面板服务响应 –

只需更换

sidebar.innerHTML = ""; 
sidebar.append(data);

与

sidebar.innerHTML = data;

为了回答您的评论，你可以使用与jQuery的以下

$(sidebar).append($(data))

所以jQuery的追加需要使用，而不是追加从dom api追加，它只在参数中使用一个节点元素。如果您仍然需要使用DOM API的追加，使用类似：

sidebar.append(document.createRange().createContextualFragme‌nt(data))

来源

2017-10-28 21:47:01

我不知道为什么这个工程，但它的工作原理。我猜它与附加功能有关？谢谢:) – Shawn

append如果你仍然想使用它，你可以在循环中使用document.createElement api，或者使用sidebar.append（document.createRange（）。createContextualFragment（data）） –

在$.ajax()调用添加dataType: "html"的特性，如：

$.ajax({ 
     method: "POST", 
     url: 'meal_list.php', 
     dataType: "html", 
     data: {meals: meals}, 
     success: function(data) { 
     var sidebar = document.getElementById('sidebar'); 
     sidebar.innerHTML = ""; 
     sidebar.append(data); 
     } 
    });

这将通知调用预期的HTML数据，在响应正文中返回。

来源

2017-10-28 21:45:14

我？尝试过，但它仍然打印出div标签作为一个字符串。 – Shawn

Ajax调用以纯字符串格式返回数据。

回答

相关问题