紧接上篇，jQuery调用jsonp，并且在页面上展示

在上篇中提到了spring4.1+支持jsonp的调用，做了个例子，用来在页面上展示jsonp：

（js写的丑了点，本人后端出生，前端大侠们轻拍~）

 var Menu = function () {

     return {
         getMenuData: function (json) {
             console.log(json);
             var data = json.data;
             var html = "";
             for (var i = 0 ; i < data.length ; i ++) {
                 var url = data[i].u;
                 var name = data[i].n;
                 var sub = data[i].i;

                 html += "";
                 html += "<li class='dropdown-submenu'>";
                 html += "<a href='" + url + "'>" + name;
                 html += "<span class='c-arrow c-toggler'></span>";
                 html += "</a>";
                 html += "<ul class='dropdown-menu c-pull-right'>";

                 for (var j = 0 ; j < sub.length ; j ++) {
                     var url = sub[j].u;
                     var name = sub[j].n;
                     var node = sub[j].i;

                     html += "<li class='dropdown-submenu'>";
                     html += "<a href='" + url + "'>" + name;
                     html += "<span class='c-arrow c-toggler'></span>";
                     html += "</a>";

                     html += "<ul class='dropdown-menu c-pull-right'>";
                     for (var k = 0 ; k < node.length ; k ++) {
 //                        debugger
                         var name = node[k];
                         var last = name.split("|");

                         html += "<li>";
                         html += "<a href='" + last[0] + "'>" + last[1] + "</a>";
                         html += "</li>";
                     }
                     html += "</ul>";
                     html += "</li>";
                 }

                 html += "</ul>";
                 html += "</li>";

             }
             $("#itemCatMenu").html(html);
         },

         getJSONP: function (serverUrl, callbackFun) {
             $.ajax({
                 type: "get",
                 url: serverUrl,
                 dataType: "jsonp",
                 jsonp: "callback",
                 jsonpCallback: callbackFun,
                 success: function(json){
 //                    console.log(json);
                 },
                 error: function(e){
                     if (e.status != "200") {
                         console.log(e);
                     }
                 }
             });
         }
     };

 }();

 $(document).ready(function()
 {
     var serverUrl = "http://localhost:8088/rest/menu/list";
     Menu.getJSONP(serverUrl, "Menu.getMenuData");
 });

展示的效果：