Question

我尝试在我的应用程序中创建通知模块。我的qus是如何在Ajax中为每个使用json数组并在下拉列表中附加

这是我的代码 -

    <script type="text/javascript">

    $( document ).ready(function() {
      $.ajax({
               url: "http://localhost/CodeIgniter_2.2.0/index.php/admin/GetNotification",
                async: false, //<-- make it synchronous
                type: "POST",
                dataType: "text",
                cache: false,
                success: function(response, status, xhr) {
                    $.each( response, function( key, value ) {
                    alert( key + ": " + value );
                    });

                    }
                }); 
});

    </script>

这是我的json数组 -

 [{"tid":"1","message":"Some on ping you","created_date":"2014-11-20 11:15:20.352631"},{"tid":"2","message":"Hello admin,Aniruddha mishra want to see Rahul patni profile","created_date":"2014-11-20 11:18:21.758673"}]

我希望在此下拉列表中使用此值 -

<ul class="dropdown-menu" id="noti" style="background-color:black">
   <li>/// here i want all value dynamically with for each  ///</li>
  </ul>

请帮助..

Answer 1

var data = [
  {"tid":"1","message":"Some on ping you","created_date":"2014-11-20 11:15:20.352631"},
  {"tid":"2","message":"Hello admin,Aniruddha mishra want to see Rahul patni profile","created_date":"2014-11-20 11:18:21.758673"}
];

#1
var $doc = $('<div />');

$.each(data, function () {
  $doc.append($('<li />').text(this.message));
});

$('#noti').html($doc.html());

#2
var menu = $.map(data, function (el) {
  return '<li>' + el.message + '</li>';
});

$('#noti').html(menu.join(''));

Answer 2

只需使用JQuery追加功能。使用ul标签id，附加li标签。希望这有效：

$( document ).ready(function() {
  $.ajax({
           url: "http://localhost/CodeIgniter_2.2.0/index.php/admin/GetNotification",
            async: false, //<-- make it synchronous
            type: "POST",
            dataType: "text",
            cache: false,
            success: function(response, status, xhr) {
                var json=JSON.parse(response);
                $.each( json, function( key, value ) {
                    $("#noti").append('<li id="'+key+'">'+value+'</li>');
                });

            }
     }); 
});

Answer 3

成功功能：

 success: function(response, status, xhr) {
 var html = "";
 $.each(response, function(key, value) {
     html += "<li>";
     html += value.message;
     html += "</li>";
     //alert( key + ": " + value );
 });
 $("#noti").append(html);
 }
 });

Answer 4

试试此演示：http://jsfiddle.net/lotusgodkk/1cy803ar/5/

JS：

var data = [{
    "tid": "1",
        "message": "Some on ping you",
        "created_date": "2014-11-20 11:15:20.352631"
}, {
    "tid": "2",
        "message": "Hello admin,Aniruddha mishra want to see Rahul patni profile",
        "created_date": "2014-11-20 11:18:21.758673"
}]
for (i = 0; i < data.length; i++) {
    var li = $('<li></li>');
    li.attr({
        id: data[i]['tid'],
        date: data[i]['created_date']
    }).text(data[i]['message']);
    $('#noti').append(li)
}

Answer 5

成功时调用此函数

函数onSuccess（响应） {

var temp =“”;

var noti = document.getelementByID（'noti'）;

if（response.d.length＆gt; 0） {

for（i = 0; i

{

temp + =“＆lt; li value =”response.d [i] .message“＆gt;”+ response.d [i] .message +“＆lt; / li＆gt;”

}

} $（“＃”+ noti）.append（temp）;

}

如何在下拉列表中使用Json数组值？

5 个答案: