Question

我有一个按钮，它对一个php文件进行ajax调用，然后发送一些html数据作为响应。

$.ajax({
                type: 'POST',
                data: {
                    cherry: cherry,
                    chocolatechip: chocolatechip,
                    butterscotchchip: butterscotch,
                    gems: gems,
                    sweetner: sweetner
                },
                url: 'customcakebox.php',
                success: function (content) {


                }
            });

Html Response包含以下三个元素：

<img id="abc1" src="ski.png" height="13px" width="15px">
<img id="abc2" src="cho.png" height="15px" width="15px">
<img id="abc3" src="cho.png" height="15px" width="15px">

但是，这些元素可以根据php文件中指定的条件减少或增加。

我想要做的是循环遍历这些元素并仅打印那些我想要打印的元素？

注意： 我知道你会说为什么我不能通过我需要展示的那些。好吧，问题是我要显示每个元素在div中随机进行并使其工作。我确实需要它们中的每一个。

Random positon of elements inside div这就是我想要实现的目标。（这仅供参考我想做的事情）

.php文件：

require 'connect.inc.php';
require 'session/inc.encrypt.php';
$cherry = $_REQUEST['cherry'];
$chocolatechip = $_REQUEST['chocolatechip'];
$butterscotchchip = $_REQUEST['butterscotchchip'];
$gems = $_REQUEST['gems'];
$sweetner=$_REQUEST['sweetner'];
$items = '';
if ($cherry > 20)
    $cherry = 20;
else if ($cherry < 0)
    $cherry = 0;
if ($chocolatechip > 20)
    $chocolatechip = 20;
else if ($chocolatechip < 0)
    $chocolatechip = 0;
if ($butterscotchchip > 20)
    $butterscotchchip = 20;
else if ($butterscotchchip < 0)
    $butterscotchchip = 0;
if ($gems > 20)
    $gems = 20;
else if ($gems < 0)
    $gems = 0;

if ((!empty($cherry) || $cherry == 0) && (!empty($chocolatechip) || $chocolatechip == 0) && (!empty($butterscotchchip) || $butterscotchchip == 0) && (!empty($gems) || $gems == 0)) {
    for ($i = 0; $i < $cherry; $i++)
    {

        $items .= ' <img src="ski.png" height="13px" width="15px">';
    }

    for ($i = 0; $i < $chocolatechip; $i++)
        $items .= ' <img  src="cho.png" height="15px" width="15px">';
    for ($i = 0; $i < $butterscotchchip; $i++)
        $items .= '<img  src="che.png" height="15px" width="15px">';
    for ($i = 0; $i < $gems; $i++)
        $items .= '<img  src="but.png" height="15px" width="15px">';

}

$customcake['cherry']=$cherry;
$customcake['chocolatechip']=$chocolatechip;
$customcake['butterscotchchip']=$butterscotchchip;
$customcake['gems']=$gems;
$customcake['sweetner']=$sweetner;

$_SESSION['customcake']=$customcake;

echo $items;

这里没有设置Ids。请不要提及。我会稍后再说。

Answer 1

让我们说你返回的响应是一个名为content的变量，然后把这段代码运行一个循环

 $(document).ready(function() {
  $(content).filter('img').each(function(index,item) {
    alert(item);
  });
});

并在循环中，您将每个图像作为项目对象。如果您的回复超过图像对象，那么您可以使用$（content）.filter（'img'）。每个也

Answer 2

如果你的.php可以用JSON响应，就像这样：

{
  "img1": "<img id='abc1' src='ski.png' height='13px' width='15px'>",
  "img2": "<img id='abc2' src='cho.png' height='15px' width='15px'>",
  "img3": "<img id='abc3' src='cho.png' height='15px' width='15px'>"
}

当您收到结果（作为成功回调的content参数）时，您可以像这样循环响应：

var jContent = JSON.parse(content);

for(var i = 0; i < jContent.length; ++i){

    // whatever you need to do
    console.log(jContent.img1); // <img id='abc1' src='ski.png' height='13px' width='15px'>

}

Answer 3

您需要在PHP文件中创建一个元素数组，然后将其作为JSON对象返回。

json_encode( $img_array, JSON_UNESCAPED_UNICODE );

然后你可以在成功函数中使用该数组制作你的东西。别忘了通过选项 dataType 。

$.ajax({
                type: 'POST',
                data: {
                    cherry: cherry,
                    chocolatechip: chocolatechip,
                    butterscotchchip: butterscotch,
                    gems: gems,
                    sweetner: sweetner
                },
                url: 'customcakebox.php',
                success: function (content) {


                },
                dataType : "json"

        });

循环遍历ajax响应元素

3 个答案: