dongzhao1930
2016-07-12 18:52
浏览 55
已采纳

无法在ajax调用后使用jquery解析json

this is my php script

<?php

$wishes_array["wishes_text"] = null;
$wishes_array["total"] = null;
$count = 0;
// wishes has all records
if(!is_null($wishes))
{
    foreach($wishes as $wish)
    {
        if($wish->text != null)
        {
             $wishes_array["wishes_text"][$count] = html_escape($wish->text);
             $count++;
        }
     }
     $wishes_array["total"] = sizeof($wishes);
     echo json_encode($wishes_array);
}
?>

background

a user sends his wishes using a button, but he has an option to send some message with his wish, suppose person A just sent wish, but person B sent wish with text "happy birthday", person C sent wish with text "have a great birthday"

now using this array we have array which tells total number of wishes recieved(with and without wish text) and wishes the text of the wishes sent by person.

problem

unable to use parse the json using jquery, here is what i've done and it return undefined

var total_start = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i> ';
var total_end = '</div>';
var startString = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>';
var endSting = '</div>';
var wishes = '';
var count = 0;
if(data["wishes_text"] != null){
     $.each(data, function(index, element) {
         wishes += startString;
         wishes += ' ' + data["wishes_text"][count];
         wishes += endSting;
         count++;
     });
 }
 var total = "";
 if(data["total"] == 1)
 {
     total = total_start + data["total"] + ' person wished' + total_end;
 }
 else
 {
     total = total_start + data["total"] + ' people wished' + total_end;
 }
 $('#wish_div').html(total + wishes);

ajax response json

{"wishes_text":["wish 1","wish 2"],"total":3}

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • duandushang5148 2016-07-12 19:16
    已采纳

    The issue in your code is simply that you're attempting to iterate through data instead of the wishes_text array contained within data. Note that you can also tidy up the logic slightly. Try this:

    var total = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>' + data["total"] + ' ' + (data.total == 1 ? 'person' : 'people') + ' wished</div>';
    var startString = '<div style="padding: 3px;margin: 10px auto;"><i class="fa fa-heart" style="background: #e53935; color: #fff;padding: 5px;border-radius: 50%;"></i>';
    var endSting = '</div>';
    var wishes = '';
    
    if (data.wishes_text != null) {
        $.each(data.wishes_text, function(index, element) {
            wishes += startString + ' ' + data["wishes_text"][index] + endSting;
        });
    }
    $('#wish_div').html(total + wishes);
    

    Working example

    I'd also suggest you look in to using stylesheets and classes over inline styling, and also a templating library as the large chunks of HTML in the JS code are on the limit of being 'too big', from a best practice point of view.

    已采纳该答案
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题