尝试将JSON对象绑定到下拉列表

时间:2015-05-14 14:10:37

标签: javascript jquery asp.net json

下午好,所以, 我有一个名为“#dropDownDest”的下拉框我试图绑定 此下拉列表中的JSON对象“dropdowndest”但无法执行此操作。 你能告诉我我到底做错了什么吗?

 $('#dropDownDest').html('<pre>' + JSON.stringify(JSONOBJECT) + '</pre>');

这是返回JSON元素的示例:

{
 "kind": "youtube#searchListResponse",
 "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/x2_4Du3jO25OnFY9_O_B3xXrQC0\"",
 "nextPageToken": "CAUQAA",
 "pageInfo": {
  "totalResults": 1000000,
  "resultsPerPage": 5
 },
 "items": [
  {
   "kind": "youtube#searchResult",
   "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/M-VYdHEsqyE1SqT3g91C7VdEHj0\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "Vi8VKaOi2nc"
   },
   "snippet": {
    "publishedAt": "2014-05-09T16:12:09.000Z",
    "channelId": "UClsy9JcwIVaq29WhPFI0eBg",
    "title": "BEST FUNNY DOGS COMPILATION LONG (2013 - 2014)",
    "description": "BEST FUNNY DOGS COMPILATION (2013 - 2014) Funny Animals includes cats, dogs, elephants, goats, otters, seals, birds, monkeys, Funny Cats, Funny, Dogs, ...",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/Vi8VKaOi2nc/default.jpg"
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/Vi8VKaOi2nc/mqdefault.jpg"
     },
     "high": {
      "url": "https://i.ytimg.com/vi/Vi8VKaOi2nc/hqdefault.jpg"
     }
    },
    "channelTitle": "onehourcompilations",
    "liveBroadcastContent": "none"
   }
  },
  {
   "kind": "youtube#searchResult",
   "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/YEKnjRQqLp8j1qKJDy8sxNW3wKY\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "D_eo7PZy4Dc"
   },
   "snippet": {
    "publishedAt": "2015-05-12T17:00:01.000Z",
    "channelId": "UC5GSO2hiHevgZUhSQIJNd2A",
    "title": "SLEEPING DOGS - RENDIAMOCI UTILI",
    "description": "A 5€ qui: http://bit.ly/ScontiGiochi Sitorna a menare le mani su Sleeping Dogs, dopo GTA 5 mi è tornata voglia di andare in Cina a picchiare un po' di sgherri.",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/D_eo7PZy4Dc/default.jpg"
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/D_eo7PZy4Dc/mqdefault.jpg"
     },
     "high": {
      "url": "https://i.ytimg.com/vi/D_eo7PZy4Dc/hqdefault.jpg"
     }
    },
    "channelTitle": "QueiDueSulServer2",
    "liveBroadcastContent": "none"
   }
  },
  {
   "kind": "youtube#searchResult",
   "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/5M32hctZeuP9PvX7ZBoiAx5oVeM\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "CpbYBZKdi3s"
   },
   "snippet": {
    "publishedAt": "2014-05-10T21:37:35.000Z",
    "channelId": "UCKy3MG7_If9KlVuvw3rPMfw",
    "title": "Cute dogs waking up owners - Funny dog compilation",
    "description": "Awesome Halloween costumes for babies, children and adults: For babies: Puppy costume: ...",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/CpbYBZKdi3s/default.jpg"
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/CpbYBZKdi3s/mqdefault.jpg"
     },
     "high": {
      "url": "https://i.ytimg.com/vi/CpbYBZKdi3s/hqdefault.jpg"
     }
    },
    "channelTitle": "wloltigerlolw2",
    "liveBroadcastContent": "none"
   }
  },
  {
   "kind": "youtube#searchResult",
   "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/0SjgjtKwO10wRaYuKHIJ15B6i1s\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "fk9iJougDFE"
   },
   "snippet": {
    "publishedAt": "2014-07-23T19:09:29.000Z",
    "channelId": "UCsKQLakuQKvr4LG4VLOpWDQ",
    "title": "10 MINUTES OF FUNNY DOGS",
    "description": "SUBSCRIBE & BECOME A FOLLOWER OF FUNNY: http://www.youtube.com/subscription_center?add_user=tuneintoaccess NEW VIDEOS MONDAY, ...",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/fk9iJougDFE/default.jpg"
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/fk9iJougDFE/mqdefault.jpg"
     },
     "high": {
      "url": "https://i.ytimg.com/vi/fk9iJougDFE/hqdefault.jpg"
     }
    },
    "channelTitle": "tuneintoaccess",
    "liveBroadcastContent": "none"
   }
  },
  {
   "kind": "youtube#searchResult",
   "etag": "\"tbWC5XrSXxe1WOAx6MK9z4hHSU8/o0Zb5d1-RECh4OCIVJgkLnvP9BA\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "RKBcs9tNWg8"
   },
   "snippet": {
    "publishedAt": "2013-08-16T03:09:51.000Z",
    "channelId": "UCVUdHi-tdW5AKdzMiTPG97Q",
    "title": "Dogs Welcoming Soldiers Home Compilation 2012 [HD]",
    "description": "Soldiers coming home to their lovable pups Dogs Welcome Home Soldiers 2014 - https://www.youtube.com/watch?v=5BnxV9H_ExA Puppies & Babies & Kitties ...",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/RKBcs9tNWg8/default.jpg"
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/RKBcs9tNWg8/mqdefault.jpg"
     },
     "high": {
      "url": "https://i.ytimg.com/vi/RKBcs9tNWg8/hqdefault.jpg"
     }
    },
    "channelTitle": "funnyplox",
    "liveBroadcastContent": "none"
   }
  }
 ]
}
 

1 个答案:

答案 0 :(得分:0)

请参阅http://jsfiddle.net/qxn7sry3/1/

您需要为选项值和文本选择一些值。您可以遍历对象中的数组,并将它们作为<option ...

附加到选择中
for (var i = 0; i < JSONOBJECT.items.length; i++) {
    var item = JSONOBJECT.items[i];
    $("#dropDownDest").append('<option value=' + item.id.videoId + '>' + item.snippet.title + '</option>');
}