2012-06-08 27 views
1

我有一個腳本呼應用戶的選擇:PHP回聲轉向HTML成文本

<script> 
     function onSuccess(data, status) 
     { 
      data = $.trim(data); 
      $("#car-check").text(data); 
     } 

     function onError(data, status) 
     { 
      // handle an error 
     }   

     $(document).ready(function() { 
      $("#submit").click(function(){ 

       var formData = $("#car-locationform").serialize(); 

       $.ajax({ 
        type: "POST", 
        url: "pages/callajax.php", 
        cache: false, 
        data: formData, 
        success: onSuccess, 
        error: onError 
       }); 

       return false; 
      }); 
     }); 
    </script> 

選擇區域:

<ul class="print-menu"> 
      <li> 
       <label for="select-choice-0" class="select">Parking Method:</label> 
       <select name="parkingoption" id="parkingoptions" data-theme="b" data-overlay-theme="d" data-native-menu="false" tabindex="-1"> 
        <option value="">Select One</option> 
        <option value="Self Parking">Self Parking</option> 
        <option value="auto">Valet Parking</option> 
       </select> 
       </li> 
       <li> 
        <div class="self carlocation"> 
         <h1>Enter Car Location:</h1> 
         <label for="select-choice-0" class="select">Floor:</label> 
         <select name="locationfloor" id="locationfloor" data-theme="b" data-overlay-theme="d" data-native-menu="false" tabindex="-1"> 
          <option value="">Floor Select</option> 
          <option value="1">F1</option> 
          <option value="2">F2</option> 
          <option value="3">F3</option> 
          <option value="4">F4</option> 
         </select> 
        </div> 
       </li> 
       <li> 
        <div class="self car-position"> 
         <label for="select-choice-0" class="select">Row:</label> 
         <select name="select-choice-15" id="positionrow" data-theme="b" data-overlay-theme="d" data-native-menu="false" tabindex="-1"> 
          <option value="">Row Select</option> 
          <option value="1">1</option> 
          <option value="2">2</option> 
          <option value="3">3</option> 
          <option value="4">4</option> 
          <option value="5">5</option> 
          <option value="6">6</option> 
          <option value="7">7</option> 
         </select> 
        </div> 
       </li>    
       <li> 
        <div class="self car-section"> 
         <label for="select-choice-0" class="select">Section:</label> 
         <select name="select-choice-15" id="positionrow" data-theme="b" data-overlay-theme="d" data-native-menu="false" tabindex="-1"> 
          <option value="">Section Select</option> 
          <option value="A">A</option> 
          <option value="B">B</option> 
          <option value="C">C</option> 
          <option value="D">D</option> 
          <option value="E">E</option> 
          <option value="F">F</option> 
          <option value="G">G</option> 
         </select> 
        </div> 
       </li> 
       <li> 
        <div class="self car-section"> 
         <label for="select-choice-0" class="select">Spot:</label> 
         <select name="select-choice-15" id="position-row" data-theme="b" data-overlay-theme="d" data-native-menu="false" tabindex="-1"> 
          <option value="">Spot Select</option> 
          <option value="1-A">1-A</option> 
          <option value="2-B">2-B</option> 
          <option value="3-C">3-C</option> 
          <option value="4-D">4-D</option> 
          <option value="5-E">5-E</option> 
          <option value="6-F">6-F</option> 
          <option value="7-G">7-G</option> 
         </select> 
        </div> 
       </li> 
       <div class="self car-submit"> 
        <button id="submit" type="submit" name="submit" value="submit" data-theme="b">Submit</button> 
       </div> 
      </ul> 
      <div id="car-check"></div> 

AJAX頁面:

<?php 
    $parktype = $_POST["parkingoption"]; 
    $carfloor = $_POST["locationfloor"]; 
    echo "<h1>Park Type: $parktype </h1>" ; 
    echo "<br/>"; 
    echo "<span> Park Type: $parktype </span>"; 
?> 

什麼都用戶選擇將在#車檢中結束。但由於某種原因,echo內部的HTML只是以文本形式出現。我只以$ parktype開始測試。

任何幫助將不勝感激,謝謝!

更新 -

謝謝大家,我覺得完全傻沒注意到。

+0

創建的jsfiddle? http://jsfiddle.net –

+0

如果只是簡單地將用戶輸入嵌入到HTML中,您知道自己很容易受到跨端腳本攻擊嗎?我建議在開發嚴肅的Web應用程序之前閱讀一些安全基礎知識。 – AardvarkSoup

+0

感謝您的通知,但此Web應用程序將不會有效。 – shayward

回答

1

使用dataType:'html'

  $.ajax({ 
       type: "POST", 
       dataType:'html', 
       url: "pages/callajax.php", 
       cache: false, 
       data: formData, 
       success: onSuccess, 
       error: onError 
      }); 

而變化:

$("#car-check").text(data); 

要:

$("#car-check").html(data); 
2

變化$("#car-check").text(data);$("#car-check").html(data);