Object 在jquery/AJAX数据库查询之后创建javascript对象

嗨，这是我想运行的代码的一个示例：

        $('#search1').submit(function(){
    var date = $('#date').val();
    var location = $('#location').val();
    var datastring = 'date=' + date + '&location=' + location;
    $.ajax({
        type: "POST",
        cache: "true",
        url: "search.php",
        dataType:"json",
        data: datastring,
        success: function(data){
            $('#main').html('')
            for ($i = 0, $j = data.bus.length; $i < $j; $i++) {

                //Create an object for each successful query result that holds information such as departure time, location, seats open...

                   $('#main').append(html);

            }

$（'#search1'）。提交（函数（）{
var date=$（'#date'）.val（）；
var location=$（'#location'）.val（）；
var datastring='date='+date+'&location='+location；
$.ajax({
类型：“POST”，
缓存：“真”，
url:“search.php”，
数据类型：“json”，
数据：datastring，
成功：功能（数据）{
$（'#main'）.html（''）
对于（$i=0，$j=data.bus.length；$i<$j；$i++）{
//为每个成功的查询结果创建一个对象，该对象包含诸如出发时间、位置、座位开放等信息。。。
$（'#main'）.append（html）；
}

---

如何对成功函数进行编码？我希望对象存储每条总线的信息，以便在搜索结果中显示这些信息，并且在用户稍后确认其RSVP时可以引用这些信息。提前感谢

您可以在包含范围内声明一个对象用作地图：

var busInfo = {};

…然后，如果总线条目具有某种形式的唯一标识符，您可以这样记录它们：

success: function(data){
    var $i, $j, bus;

    $('#main').html('')
    for ($i = 0, $j = data.bus.length; $i < $j; $i++) {
        // Remember this bus by ID
        bus = data.bus[$i];
        busInfo[bus.id] = bus;

        $('#main').append(html);
    }
}

这是因为所有JavaScript对象都是键/值映射。键始终是字符串，但解释器会很高兴地从您提供的内容中生成字符串（例如，

busInfo[42]=…

将起作用，

42

将隐式变为

“42”

）

如果您只需要一个数组，那么您的

data.bus

已经是一个数组了，对吗

var busInfo = [];

// ....

success: function(data){
    var $i, $j;

    // Remember it
    busInfo = data.bus;

    $('#main').html('')
    for ($i = 0, $j = data.bus.length; $i < $j; $i++) {

        $('#main').append(html);
    }
}

---

---

主题外：请注意，我已将

var$I，$j；

添加到您的成功函数中。没有它，您将沦为牺牲品，从名称可以看出这是一件坏事（tm）。

为什么不简单：var busdata；$.ajax（{………函数（数据）{……busdata data=data.bus；}

var busInfo = [];

// ....

success: function(data){
    var $i, $j;

    // Remember it
    busInfo = data.bus;

    $('#main').html('')
    for ($i = 0, $j = data.bus.length; $i < $j; $i++) {

        $('#main').append(html);
    }
}

<input type='button' id='btnLoad' value='Load Buses'>
<br>...and then click a bus below:
<ul id="busList"></ul>
...to see details here:
<table style="border: 1px solid #aaa;">
  <tbody>
    <tr>
      <th>ID:</th>
      <td id="busId">--</td>
    </tr>
    <tr>
      <th>Name:</th>
      <td id="busName">--</td>
    </tr>
    <tr>
      <th>Route:</th>
      <td id="busRoute">--</td>
    </tr>
  </tbody>
</table>

jQuery(function($) {
  // Our bus information -- note that it's within a function,
  // not at global scope. Global scope is *way* too crowded.
  var busInfo = {};

  // Load the buses on click
  $("#btnLoad").click(function() {
    $.ajax({
      url: "http://jsbin.com/ulawem",
      dataType: "json",
      success: function(data) {
        var busList = $("#busList");

        // Clear old bus info
        busInfo = {};

        // Show and remember the buses
        if (!data.buses) {
          display("Invalid bus information received");
        }
        else {
          $.each(data.buses, function(index, bus) {
            // Remember this bus
            busInfo[bus.id] = bus;

            // Show it
            $("<li class='businfo'>")
              .text(bus.name)
              .attr("data-id", bus.id)
              .appendTo(busList);
          });
        }
      },
      error: function() {
        display("Error loading bus information");
      }
    });
  });

  // When the user clicks a bus in the list, show its deatils
  $("#busList").delegate(".businfo", "click", function() {
    var id = $(this).attr("data-id"),
        bus = id ? busInfo[id] : null;
    if (id) {
      if (bus) {
        $("#busId").text(bus.id);
        $("#busName").text(bus.name);
        $("#busRoute").text(bus.route);
      }
      else {
        $("#busId, #busName, #busRoute").text("--");
      }
    }
  });

});

{"buses": [
    {"id": 42, "name": "Number 42", "route": "Highgate to Wycombe"},
    {"id": 67, "name": "Old Coach Express", "route": "There and Back"}
]}