0

我有这个 html 代码部分

 <div id="prt">
         <select name="selectPrt" class="span12" onchange="sta_callPRT();">
          <option value="noPrt">Choose one vehicle.</option>
          <option value="prt1">PRT 1</option>
          <option value="prt2">PRT 2</option>
          <option value="prt3">PRT 3</option>
          <option value="prt4">PRT 4</option>
          <option value="prt5">PRT 5</option>
        </select>
        <div class="row-fluid">
         <div class="span6">
           <div class="section">
            <div class="sectionTitle">
              <h3>Vehicle Info</h3>
            </div>
          </div>
<div id="state"><strong>State:</strong> </div>
          <div id="freeSeats"><strong>freeSeats:</strong></div>
          <div id="battery"><strong>battery:</strong></div>
          <div id="totalDistance"><strong>totalDistance:</strong></div>
          <div id="location"><strong>Location:</strong></div>
          <div id="estimatedTime"><strong>estimatedTime"</strong></div>
          <div id="estimatedDistance"><strong>estimatedDistance:</strong></div>
          <div id="speed"><strong>speed:</strong></div>

而这个 Javascript

function sta_callPRT(){

    $.getJSON('PRTInfoGenerator.php', function(json){

        $.each(json, function(key, value) {

       if(key=="state") {
          //$('#state').empty();
          //document.getElementById("parameters").appendChild(divTag);
          $('#state').append(value);
                      }
       if(key=="freeSeats") {
          $('#freeSeats').append(value);
        }
       if(key=="estimatedDistance"){
        $('#estimatedDistance').append(value);
       }
        if(key=="estimatedTime"){
        $('#estimatedTime').append(value);
       }
        if(key=="battery"){
        $('#battery').append(value);
       }
        if(key=="speed"){
        $('#speed').append(value);
       }
        if(key=="location"){
          $.each(json.location, function(par_key, par_value) {

        $('#location').append(par_key+': '+par_value+'  ');
      });
       }
       if(key=="totalDistance"){
        $('#totalDistance').append(value);
       }
    });

  });
  }

我想在 html 中随机写入车辆值。我还有 php 代码来为车辆生成随机值。当我选择车辆时,它会显示一些值,但在第二次选择中,新值被添加到第一个的末尾。如何删除以前的值,并在进行新选择时添加新值?例如这是网页中的第一个选择;

State: Running
freeSeats:0
battery:95
totalDistance:8541
Location:x: -5 y: 34
estimatedTime:15
estimetedDistance:809
Speed:18

这是第二个;

State: RunningRunning
freeSeats:04
battery:9540
totalDistance:85411848
Location:x: -5 y: 34 x: 84 y: -70
estimatedTime:15269
estimetedDistance:809513
Speed:1818
4

2 回答 2

0

将前缀文本移到 div 之外freeseats: <div id="freeSeats"></div>,使用$('#freeSeats').text(value)而不是 $('#freeSeats').append(value); 追加将追加已经存在的内容,但文本将替换该值。

更改强标签中的文本,$('#freeSeats strong')但我建议不要使用强标签,而是在 div/div 上使用样式属性。

这是您的更新代码:

<div id="prt"> 
          <select name="selectPrt" class="span12" onchange="sta_callPRT();">
          <option value="noPrt">Choose one vehicle.</option>
          <option value="prt1">PRT 1</option>
          <option value="prt2">PRT 2</option>
          <option value="prt3">PRT 3</option>
          <option value="prt4">PRT 4</option>
          <option value="prt5">PRT 5</option>
        </select>
        <div class="row-fluid">
         <div class="span6">
           <div class="section">
            <div class="sectionTitle">
              <h3>Vehicle Info</h3>
            </div>
          </div>
          State:<div id="state"></div>
          freeSeats:<div id="freeSeats"></div>
          battery:<div id="battery"></div>
          totalDistance:<div id="totalDistance"></div>
          Location:<div id="location"></div>
          estimatedTime"<div id="estimatedTime"></div>
          estimatedDistance:<div id="estimatedDistance"></div>
          speed:<div id="speed"></div>

和脚本:

function sta_callPRT(){

$.getJSON('PRTInfoGenerator.php', function(json){

    $.each(json, function(key, value) {

   if(key=="state") {
      $('#state').text(value);
                  }
   if(key=="freeSeats") {
      $('#freeSeats').text(value);
    }
   if(key=="estimatedDistance"){
    $('#estimatedDistance').text(value);
   }
    if(key=="estimatedTime"){
    $('#estimatedTime').text(value);
   }
    if(key=="battery"){
    $('#battery').text(value);
   }
    if(key=="speed"){
    $('#speed').text(value);
   }
    if(key=="location"){
      $.each(json.location, function(par_key, par_value) {

    $('#location').text(par_key+': '+par_value+'  ');
  });
   }
   if(key=="totalDistance"){
    $('#totalDistance').text(value);
   }
});

`

于 2013-03-28T14:02:14.533 回答
0

每次清除 div...

function sta_callPRT(){
     $('#state, #freeSeats, #battery').empty();

     $.getJSON('PRTInfoGenerator.php', function(json){
           ...
于 2013-03-28T14:13:28.690 回答