0

这里是js函数，选择站后调用该函数，并创建图标（根据Stations.php随机来的数据）并显示在html页面中。图标也通过调用bindMyPopovers()函数与popover绑定，以来到图标时显示弹出窗口：

 function sta_callStation(sel){
  $('#noOfPassengers, #infoOfPassengers, #distType,#distParams').empty();
   $('#sta_numberOfIcons').empty();


    $.getJSON('Stations.php?id='+sel.value, function(station){

        $.each(station, function(sta_key, sta_value) {

        if(sel.value==sta_key)
        {
          $.each(sta_value.passengers, function(j,passengers) 
        {



          //$('#sta_numberOfIcons').append('<i class="icon-user" ></i>');
         var pas_icon = document.createElement("a");

          pas_icon.className ="icon-user";
          pas_icon.id='id_'+j;

          pas_icon.setAttribute('href', '#');
          pas_icon.setAttribute('rel', 'popover');
          //alert('id_'+(j));
          var empty=document.createElement("a");
          empty.appendChild(document.createTextNode(" "));
          document.getElementById('sta_numberOfIcons').appendChild(pas_icon);

          document.getElementById('sta_numberOfIcons').appendChild(empty);

      });
        }
   });
       bindMyPopovers();
  });
  }
function bindMyPopovers() {
$("a[rel=popover]").each(function(){

    $(this).popover({
        trigger: 'hover',
        placement: 'top',
        html: true,
        title:"Passenger Information",
        content: "Passenger "+$(this).attr('id')+" "+showPassenger($(this))
    })
    .click(function(e) {
        e.preventDefault()
    });
 });
}

这是使用passengerId从Passengers.php获取数据的showPassenger（在他们也有id的图标中），我想在相关弹出窗口的内容中显示即将到来的数据。

  var v;
 function showPassenger($this){      
  $("a[rel=popover]").each(function(){
  var id=$this.attr('id');
  var id_num=id.charAt(id.length-1);      

  $.getJSON('Passengers.php?passengerId='+id_num, function(passenger){
      v=null;
      $.each(passenger, function(pas_key, pas_value) {

          v+=" "+pas_key+" "+pas_value+" ";

      });


   });});return v;}

使用此代码，首先我从站组合框中选择一个站，然​​后创建图标，但是当我来到一个图标时，例如内容显示；乘客 id_1 未定义。然后第二个选择我得到一些关于乘客的信息（例如从：2，到：3）。但是对于其他乘客图标，他们的弹出内容中显示了相同的数据。为什么要绑定相同的数据所有的图标？如何更改代码？

4

1 回答 1

0 
 function sta_callStation(sel){
 var numberOfPassengers=0;
 $('#noOfPassengers, #infoOfPassengers, #distType,#distParams').empty();
     $('#sta_numberOfIcons').empty();

      stationId=sel.value;
      stationId++;
      $.getJSON('Stations.php?id='+sel.value, function(station){

          $.each(station, function(sta_key, sta_value) {

          if(sel.value==sta_key)
          {
            $.each(sta_value.passengers, function(j,passengers) 
          {
            numberOfPassengers++;
            var pas_icon = document.createElement("a");

            pas_icon.className ="icon-user";
            pas_icon.id=(j+1);

            pas_icon.setAttribute('href', '#');
            pas_icon.setAttribute('rel', 'popover');

            var empty=document.createElement("a");
            empty.appendChild(document.createTextNode(" "));
            document.getElementById('sta_numberOfIcons').appendChild(pas_icon);

            document.getElementById('sta_numberOfIcons').appendChild(empty);

        });
            $("#noOfPassengers").append("Yolcu Sayısı:"+numberOfPassengers);
          }
     });
         sta_bindMyPopovers();
    });
    }

 function sta_bindMyPopovers() {
 $("a[rel=popover]").each(function(){
      sta_showPassenger($(this).attr('id'));
  });
 }

 var v='';
 function sta_showPassenger(id){     
    var id_num=id;      
    console.log("id: " + id);
    console.log("id_num: " + id_num);
    $.getJSON('Passengers.php/'+id_num, function(passenger){
        console.log("passenger: " + passenger );
        v='';
        $.each(passenger, function(pas_key, pas_value) {

            v+=" "+pas_key+" "+pas_value+" ";

        });

        $("#"+id).popover({
          trigger: 'hover',
          placement: 'top',
          html: true,
          title:"Passenger "+ id_num ,
          content: " " + v
      })
      .click(function(e) {
          e.preventDefault();
      });

  });

   console.log("v: " + v);
  return v;
}
于 2013-04-19T11:01:20.923 回答