2012-12-18 48 views
0

我有一個使用jQuery移動框架V1.2.0和jQuery V1.8.2構建的移動網站。jQuery移動表單不提交第二次

問題是,當我訪問最新的iPhone上的網站,並再次填寫表格,它不會發送。一旦我輸入了信息並點擊提交,該頁面就會重新加載一個空白表單。

我對JavaScript的知識很少,這使我對調試變得困難。

有沒有人有這個問題或看到任何可能的原因?

對不起,如果所有需要的文件都不在這裏。我不確定需要什麼來幫助我進行調試。只是問,我會提供。

謝謝!

表:

<?php 

    $values = $_POST; 

    $full_name = $values['fullname']; 
    $email_address = $values['email']; 
    $phone_number = $values['phone']; 
    $vehicle_type = $values['vehicle_type']; 
    $travel_type = $values['travel_type']; 
    $occassion = $values['occassion']; 
    $departure_date = $values['departure_date']; 
    $departure_time = $values['departure_time']; 
    $hours_requested = $values['hours_requested']; 
    $pickup_location = $values['pickup_location']; 
    $dropoff_location = $values['dropoff_location']; 
    $notes = $values['notes']; 

    //Check if necessary values are set 

    if (isset($full_name) && isset($email_address) && isset($vehicle_type) && isset($occassion) && isset($departure_time) && isset($departure_date) && isset($travel_type) && isset($pickup_location) && isset($dropoff_location)){ 

    // Body: 

    $message = '<html><body>'; 
    $message .= '<h1>New Quote Request</h1>'; 
    $message .= '<table rules="all" style="border-color: #666;" cellpadding="10">'; 
    $message .= "<tr><td><strong>Name:</strong> </td><td>" . $full_name . "</td></tr>"; 
    $message .= "<tr><td><strong>Email:</strong> </td><td>" . $email_address . "</td></tr>"; 
    $message .= "<tr><td><strong>Phone:</strong> </td><td>" . $phone_number . "</td></tr>"; 
    $message .= "<tr><td><strong>Vehicle Type:</strong> </td><td>" . $vehicle_type . "</td></tr>"; 
    $message .= "<tr><td><strong>Departure Date:</strong> </td><td>" . $departure_date . "</td></tr>"; 
    $message .= "<tr><td><strong>Departure Time:</strong> </td><td>" . $departure_time . "</td></tr>"; 
    $message .= "<tr><td><strong>Travel Type:</strong> </td><td>" . $travel_type . "</td></tr>"; 
    $message .= "<tr><td><strong>Occassion:</strong> </td><td>" . $occassion . "</td></tr>"; 
    $message .= "<tr><td><strong>Hours Requested:</strong> </td><td>" . $hours_requested . "</td></tr>"; 
    $message .= "<tr><td><strong>Pickup Location:</strong> </td><td>" . $pickup_location . "</td></tr>"; 
    $message .= "<tr><td><strong>Dropoff Location:</strong> </td><td>" . $dropoff_location . "</td></tr>"; 
    $message .= "<tr><td><strong>Notes:</strong> </td><td>" . $notes . "</td></tr>"; 
    $message .= "</table>"; 
    $message .= "</body></html>"; 


    $headers = "From: $email_address\r\n"; 
    $headers .= "Content-type: text/html\r\n"; 

    $to = '[email protected]'; 
    $subject = 'New Quote Request'; 

    //If mail successfully sent 
    if (mail($to, $subject, $message, $headers)){ 

     header('Location: sent.html'); 
    } 
} 

?> 
<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<title>Get a Quote</title> 
<link href="css/styles.css" rel="stylesheet" type="text/css"> 

<!--jQuery--> 
<link href="css/jquery-ui-1.8.23.custom.css" rel="stylesheet" type="text/css"> 
<link rel="stylesheet" href="css/premier.css" /> 
<link rel="stylesheet" href="css/jquery.mobile.structure-1.2.0.min.css" /> 
<script src="js/jquery-1.8.2.min.js"></script> 
<script src="js/jquery.validate.js" type="text/javascript"></script> 
<script src="js/jquery-ui-1.8.23.custom.min.js"></script> 
<script src="js/jquery.mobile-1.2.0.min.js"></script> 
<script src="js/main.js" type="text/javascript"></script> 
<!--jQuery--> 

<script type="text/javascript"> 

var _gaq = _gaq || []; 
_gaq.push(['_setAccount', 'My Code']); 
_gaq.push(['_trackPageview']); 

(function() { 
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 
})(); 

</script> 

</head> 

<body> 

<div id="wrapper"> 

    <div id="body"> 

     <div id="header"> 

      <div id="logo"> 
       <a href="index.html"><img src="images/logo.png" alt="My Logo" width="132" height="25" border="0"></a> 
      </div> 

      <div id="menu"> 
       <a href="#popupmenu" data-rel="popup" data-position-to="window" data-transition="fade">MENU</a> 
      </div> 

      <div id="call"> 
       <a href="tel:MY Number" title="Click to Call"></a> 
      </div> 

     </div> 

     <div id="spacer-91"></div> 

     <div data-role="popup" data-overlay-theme="a" data-transition="fade" id="popupmenu"> 
      <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-right">Close</a> 
      <ul> 
       <li><a href="fleet.html" class="popupmenu-fleet" title="Fleet of Vehicles">Fleet</a></li> 
       <li><a href="services.html" class="popupmenu-services" title="Our Services">Services</a></li> 
       <li><a href="quote.php" class="popupmenu-quote" title="Free Quote" rel="external">Free Quote</a></li> 
       <li><a href="flight-tracker.html" class="popupmenu-flight-tracker" title="Flight Tracker">Flight Tracker&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></li> 
       <li><a href="contact.html" class="popupmenu-contact" title="Contact Us">Contact</a></li> 
      </ul> 
     </div> 

     <div id="quote" data-role="content" data-theme="b"> 

      <h1>Free Quote</h1> 

      <p>Fillout the form below to receive a complimentary quote</p> 

      <p><strong>Need help? Call</strong> <a href="tel:MY Number" title="MY Number">MY Number</a> 

      <div> 

       <form action="quote.php" id="travel_form" method="post"> 

        <input type="text" name="fullname" id="fullname" value="" placeholder="Name" class=""/> 
        <input class="" type="text" name="email" id="email" value="" placeholder="Email"/> 
        <input type="text" name="phone" id="phone"value="" placeholder="Phone (optional)"/> 

        <br/> 

        <select name="vehicle_type" id="vehicle_type" class=""> 
         <option value="">Vehicle Type</option> 
         <option value="Rolls-Royce Phantom">Rolls-Royce Phantom</option> 
         <option value="BMW 750Li">BMW 750Li</option> 
         <option value="Lexus LS 460L">Lexus LS 460L</option> 
         <option value="Mercedes S550">Mercedes S550</option> 
         <option value="Executive Sedan">Executive Sedan</option> 
         <option value="MKT Town Car">MKT Town Car</option> 
         <option value="Luxury SUV">Luxury SUV</option> 
         <option value="Stretch Limousine 6 Passenger">Stretch Limousine 6 Passenger</option> 
         <option value="Stretch Limousine 8 Passenger">Stretch Limousine 8 Passenger</option> 
         <option value="Expedition Limousine">Expedition Limousine</option> 
         <option value="Navigator Limousine">Navigator Limousine</option> 
         <option value="Hummer Limousine">Hummer Limousine</option> 
         <option value="Pinky Limousine">Pinky Limousine</option> 
         <option value="Executive Van">Executive Van</option> 
         <option value="Passenger Van">Passenger Van</option> 
         <option value="Limo Bus 10 Passenger">Limo Bus 10 Passenger</option> 
         <option value="Limo Bus 22 Passenger">Limo Bus 22 Passenger</option> 
         <option value="Limo Bus 26 Passenger">Limo Bus 26 Passenger</option> 
         <option value="Limo Bus 28 Passenger">Limo Bus 28 Passenger</option> 
         <option value="Shuttle Bus 28 Passenger">Shuttle Bus 28 Passenger</option> 
         <option value="Mini Coach 29 Passenger">Mini Coach 29 Passenger</option> 
         <option value="Mini Coach 32 Passenger">Mini Coach 32 Passenger</option> 
         <option value="Mini Coach 40 Passenger">Mini Coach 40 Passenger</option> 
         <option value="Coach Bus 56 Passenger">Coach Bus 56 Passenger</option> 
         <option value="Coach Bus 57 Passenger">Coach Bus 57 Passenger</option> 
        </select> 

        <br/> 

        <select name="occassion" id="occassion" class=""> 
         <option value="">Occassion</option> 
         <option value="Airport Transportation">Airport Transportation</option> 
         <option value="Casino">Casino</option> 
         <option value="Corporate Travel">Corporate Travel</option> 
         <option value="Nationwide Service">Nationwide Service</option> 
         <option value="Night On The Town">Night On The Town</option> 
         <option value="Pier &amp; Cruise">Pier &amp; Cruise</option> 
         <option value="Prom">Prom</option> 
         <option value="Special Occassion">Special Occassion</option> 
         <option value="Sports Event">Sports Event</option> 
         <option value="Wedding">Wedding</option> 

        </select> 

        <br/> 

        <input type="text" name="departure_date" id="departure_date" placeholder="Departure Date (MM/DD/YYYY)" value="" class="" /> 

        <br/> 

        <select name="departure_time" id="departure_time" class=""> 
         <option value="">Departure Time</option> 
         <option value="12:00AM">12:00AM</option> 
         <option value="12:15AM">12:15AM</option> 
         <option value="12:30AM">12:30AM</option> 
         <option value="12:45AM">12:45AM</option> 
         <option value="1:00AM">1:00AM</option> 
         <option value="1:15AM">1:15AM</option> 
         <option value="1:30AM">1:30AM</option> 
         <option value="1:45AM">1:45AM</option> 
         <option value="2:00AM">2:00AM</option> 
         <option value="2:15AM">2:15AM</option> 
         <option value="2:30AM">2:30AM</option> 
         <option value="2:45AM">2:45AM</option> 
         <option value="3:00AM">3:00AM</option> 
         <option value="3:15AM">3:15AM</option> 
         <option value="3:30AM">3:30AM</option> 
         <option value="3:45AM">3:45AM</option> 
         <option value="4:00AM">4:00AM</option> 
         <option value="4:15AM">4:15AM</option> 
         <option value="4:30AM">4:30AM</option> 
         <option value="4:45AM">4:45AM</option> 
         <option value="5:00AM">5:00AM</option> 
         <option value="5:15AM">5:15AM</option> 
         <option value="5:30AM">5:30AM</option> 
         <option value="5:45AM">5:45AM</option> 
         <option value="6:00AM">6:00AM</option> 
         <option value="6:15AM">6:15AM</option> 
         <option value="6:30AM">6:30AM</option> 
         <option value="6:45AM">6:45AM</option> 
         <option value="7:00AM">7:00AM</option> 
         <option value="7:15AM">7:15AM</option> 
         <option value="7:30AM">7:30AM</option> 
         <option value="7:45AM">7:45AM</option> 
         <option value="8:00AM">8:00AM</option> 
         <option value="8:15AM">8:15AM</option> 
         <option value="8:30AM">8:30AM</option> 
         <option value="8:45AM">8:45AM</option> 
         <option value="9:00AM">9:00AM</option> 
         <option value="9:15AM">9:15AM</option> 
         <option value="9:30AM">9:30AM</option> 
         <option value="9:45AM">9:45AM</option> 
         <option value="10:00AM">10:00AM</option> 
         <option value="10:15AM">10:15AM</option> 
         <option value="10:30AM">10:30AM</option> 
         <option value="10:45AM">10:45AM</option> 
         <option value="11:00AM">11:00AM</option> 
         <option value="11:15AM">11:15AM</option> 
         <option value="11:30AM">11:30AM</option> 
         <option value="11:45AM">11:45AM</option> 
         <option value="12:00PM">12:00PM</option> 
         <option value="12:15PM">12:15PM</option> 
         <option value="12:30PM">12:30PM</option> 
         <option value="12:45PM">12:45PM</option> 
         <option value="1:00PM">1:00PM</option> 
         <option value="1:15PM">1:15PM</option> 
         <option value="1:30PM">1:30PM</option> 
         <option value="1:45PM">1:45PM</option> 
         <option value="2:00PM">2:00PM</option> 
         <option value="2:15PM">2:15PM</option> 
         <option value="2:30PM">2:30PM</option> 
         <option value="2:45PM">2:45PM</option> 
         <option value="3:00PM">3:00PM</option> 
         <option value="3:15PM">3:15PM</option> 
         <option value="3:30PM">3:30PM</option> 
         <option value="3:45PM">3:45PM</option> 
         <option value="4:00PM">4:00PM</option> 
         <option value="4:15PM">4:15PM</option> 
         <option value="4:30PM">4:30PM</option> 
         <option value="4:45PM">4:45PM</option> 
         <option value="5:00PM">5:00PM</option> 
         <option value="5:15PM">5:15PM</option> 
         <option value="5:30PM">5:30PM</option> 
         <option value="5:45PM">5:45PM</option> 
         <option value="6:00PM">6:00PM</option> 
         <option value="6:15PM">6:15PM</option> 
         <option value="6:30PM">6:30PM</option> 
         <option value="6:45PM">6:45PM</option> 
         <option value="7:00PM">7:00PM</option> 
         <option value="7:15PM">7:15PM</option> 
         <option value="7:30PM">7:30PM</option> 
         <option value="7:45PM">7:45PM</option> 
         <option value="8:00PM">8:00PM</option> 
         <option value="8:15PM">8:15PM</option> 
         <option value="8:30PM">8:30PM</option> 
         <option value="8:45PM">8:45PM</option> 
         <option value="9:00PM">9:00PM</option> 
         <option value="9:15PM">9:15PM</option> 
         <option value="9:30PM">9:30PM</option> 
         <option value="9:45PM">9:45PM</option> 
         <option value="10:00PM">10:00PM</option> 
         <option value="10:15PM">10:15PM</option> 
         <option value="10:30PM">10:30PM</option> 
         <option value="10:45PM">10:45PM</option> 
         <option value="11:00PM">11:00PM</option> 
         <option value="11:15PM">11:15PM</option> 
         <option value="11:30PM">11:30PM</option> 
         <option value="11:45PM">11:45PM</option> 
        </select> 

        <br/> 

        <fieldset data-role="controlgroup" data-type="horizontal" id="travelTypeControls"> 
         <legend> 
         <div onClick="document.getElementById('tt1').style.display='block'" onMouseOut="document.getElementById('tt1').style.display='none'" class="questionMark"> 
          Travel&nbsp;type:&nbsp;<img src="images/question-mark.png" width="14" height="14" alt="What's This?"> 
          <div id="tt1" class="toolTip"> 
           A <strong>Point to Point</strong> reservation is a one way trip that is based on a flat fee. An <strong>Hourly Rental</strong> is a fixed rate that is billed according to the number of hours the vehicle is reserved for. 
          </div> 
         </div> 
         </legend> 
         <input type='radio' id="radio-choice-1" class="pointtopoint" name='travel_type' value='pointtopoint'> 
         <label class="" for="radio-choice-1">Point to Point</label> 
         <input type='radio' id="radio-choice-2" class="hourly" name='travel_type' value='hourly'> 
         <label class="" for="radio-choice-2">Hourly</label> 
        </fieldset> 

        <br/> 

        <select name="hours_requested" id="hours_requested" class=""> 
         <option value="">Hours Requested</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> 
         <option value="8">8</option> 
         <option value="9">9</option> 
         <option value="10">10</option> 
         <option value="11">11</option> 
         <option value="12">12</option> 
         <option value="13">13</option> 
         <option value="14">14</option> 
         <option value="15">15</option> 
         <option value="16">16</option> 
         <option value="17">17</option> 
         <option value="18">18</option> 
         <option value="19">19</option> 
         <option value="20">20</option> 
         <option value="21">21</option> 
         <option value="22">22</option> 
         <option value="23">23</option> 
         <option value="24">24</option> 
         <option value="24 Plus">24+</option> 
        </select> 

        <br/> 

        <input type="text" name="pickup_location" id="pickup_location" value="" placeholder="Pick-up Location" class="" /> 

        <input type="text" name="dropoff_location" id="dropoff_location" value="" placeholder="Drop-off Location" class="" /> 

        <br/> 

        <textarea name="notes" id="notes" placeholder="Special Instructions"></textarea> 

        <br/> 

        <div id="submit_button"> 
         <input type="submit" value="Submit" name="submit" /> 
        </div> 

       </form> 

      </div> 

     </div> 

     <div id="footer" data-role="footer" data-position="fixed" data-tap-toggle="false"> 

      <div class="left"> 
       &copy; 2012 MY Site 
      </div> 

      <div class="right"> 
       <a href="http://www.mysite.com" title="View Full Site">View Full Site</a> 
      </div> 

     </div> 

    </div> 

</div> 

</body> 
</html> 
+0

不知道這是否是相關的,但是這會是一個緩存的問題? –

回答

1

添加data-ajax="false"可以治癒的問題。這通過表單操作提交表單。此外,JQM建議爲表單操作提供完整的url。

因此,例如,您的表單標籤應該開始像圖所示

<form action="http://www.example.com/quote.php" data-ajax="false" id="travel_form" method="post"> 
相關問題