【发布时间】:2014-01-09 18:32:13
【问题描述】:
我有一个提交给自己的页面 (index2.php),从 MySQL 数据库中提取记录并更新结果表上的价格。
我编写的代码需要 6 个记录集: rstCar2(完整的汽车列表 - 使用 % 通配符) rstCarsSw(匹配 countryid '1' 的汽车) rstCarsFr(匹配 countryid '2' 的汽车) rstCarsIt(匹配 countryid '3' 的汽车) rstCarsGer(匹配 countryid '4' 的汽车) rstCarsAus(匹配 countryid '5' 的汽车)
并显示 6 个 DIV,每个 DIV 都有一个专用于一组汽车的列表(每个都命名为“pyt-car”) - 每个列表显示每个国家/地区可用的汽车。
这些国家/地区的值从 1 到 6 列出
因此,当您选择一个国家/地区时,Jquery 会更改 CSS,以便隐藏 5 个 DIV 并显示一个。当您选择其他国家/地区时,汽车列表会即时调整,以便用户只能看到该国家/地区可用的汽车。
一开始,你可以多次换车,但一旦你点击一个国家,一切就都出错了。
选择国家后,选择一辆车,点击提交,拒绝换车,页面加载时,好像卡在选择的车上。
出于某种奇怪的原因,奥地利(id 为 5)似乎允许我换车,但是当我切换到德国或其他任何地方时,一切都崩溃了。
这是有问题的页面....http://www.ultimatedrives.net/plan-your-trip/index2.php
我对 PHP 很好,但是 JavaScript/Jquery 新手,所以这段代码可能很原始......
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var countryid = "pyt-country = <?php echo $_POST['pyt-country'] ; ?><br/>";
document.write(countryid);
var carid = "pyt-car = <?php echo $_POST['pyt-car'] ; ?>";
document.write(carid);
if (countryid == "%") {
$('.carAll').css('display', 'block');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if (countryid == "1") {
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'block');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if (countryid == "2") {
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'block');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if (countryid == "3") {
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'block');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if (countryid == "4") {
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'block');
$('.carAus').css('display', 'none');
}
if (countryid == "5") {
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'block');
}
$(document).ready(function () {
$('#pyt-country').change(function () {
if($(this).val() == "%"){
$('.carAll').css('display', 'block');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if($(this).val() == "1"){
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'block');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if($(this).val() == "2"){
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'block');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if($(this).val() == "3"){
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'block');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
if($(this).val() == "4"){
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'block');
$('.carAus').css('display', 'none');
}
if($(this).val() == "5"){
$('.carAll').css('display', 'none');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'block');
}
});
}); // End eventlistener
</script>
<form action="index2.php" method="post" name="plan-your-trip" id="plan-your-trip">
<table border="0" align="right" cellpadding="0" cellspacing="5">
<tr>
<td><select name="pyt-country" id="pyt-country">
<option value="%" <?php if ($_POST['pyt-country'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-country'] == '%') {echo "selected=\"selected\"";} ?>>Any Country...</option>
<?php do { ?>
<option value="<?php echo $row_rstCountry['ID']; ?>" <?php if (!(strcmp($row_rstCountry['ID'], $_POST['pyt-country']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCountry['CountryName']; ?></option>
<?php } while ($row_rstCountry = mysql_fetch_assoc($rstCountry)); ?>
</select></td>
<td>
<div class="carAll">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCar2['car_ID']; ?>" <?php if (!(strcmp($row_rstCar2['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCar2['car_Name']; ?></option>
<?php } while ($row_rstCar2 = mysql_fetch_assoc($rstCar2)); ?>
</select>
</div>
<div class="carSw">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCarsSw['car_ID']; ?>" <?php if (!(strcmp($row_rstCarsSw['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCarsSw['car_Name']; ?></option>
<?php } while ($row_rstCarsSw = mysql_fetch_assoc($rstCarsSw)); ?>
</select>
</div>
<div class="carFr">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCarsFr['car_ID']; ?>" <?php if (!(strcmp($row_rstCarsFr['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCarsFr['car_Name']; ?></option>
<?php } while ($row_rstCarsFr = mysql_fetch_assoc($rstCarsFr)); ?>
</select>
</div>
<div class="carIt">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCarsIt['car_ID']; ?>" <?php if (!(strcmp($row_rstCarsIt['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCarsIt['car_Name']; ?></option>
<?php } while ($row_rstCarsIt = mysql_fetch_assoc($rstCarsIt)); ?>
</select>
</div>
<div class="carGer">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCarsGer['car_ID']; ?>" <?php if (!(strcmp($row_rstCarsGer['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCarsGer['car_Name']; ?></option>
<?php } while ($row_rstCarsGer = mysql_fetch_assoc($rstCarsGer)); ?>
</select>
</div>
<div class="carAus">
<select name="pyt-car" id="pyt-car">
<option value="%" <?php if ($_POST['pyt-car'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-car'] == '%') {echo "selected=\"selected\"";} ?>>Any Car...</option>
<?php do { ?>
<option value="<?php echo $row_rstCarsAus['car_ID']; ?>" <?php if (!(strcmp($row_rstCarsAus['car_ID'], $_POST['pyt-car']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstCarsAus['car_Name']; ?></option>
<?php } while ($row_rstCarsAus = mysql_fetch_assoc($rstCarsAus)); ?>
</select>
</div>
</td>
<td> </td>
</tr>
<tr>
<td><select name="pyt-month" id="pyt-month">
<option value="%" <?php if ($_POST['pyt-month'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-month'] == '%') {echo "selected=\"selected\"";} ?>>Any Month...</option>
<?php
do {
?>
<option value="<?php echo $row_rstMonth['mNumber']?>"<?php if (!(strcmp($row_rstMonth['mNumber'], $_POST['pyt-month']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstMonth['mName']?></option>
<?php
} while ($row_rstMonth = mysql_fetch_assoc($rstMonth));
$rows = mysql_num_rows($rstMonth);
if($rows > 0) {
mysql_data_seek($rstMonth, 0);
$row_rstMonth = mysql_fetch_assoc($rstMonth);
}
?>
</select></td>
<td><select name="pyt-style" id="pyt-style">
<option value="%" <?php if ($_POST['pyt-style'] == '') {echo "selected=\"selected\"";} ?><?php if ($_POST['pyt-style'] == '%') {echo "selected=\"selected\"";} ?>>Any Break Style...</option>
<?php do { ?>
<option value="<?php echo $row_rstGenre['ID']; ?>" <?php if (!(strcmp($row_rstGenre['ID'], $_POST['pyt-style']))) {echo "selected=\"selected\"";} ?>><?php echo $row_rstGenre['GenreName']; ?></option>
<?php } while ($row_rstGenre = mysql_fetch_assoc($rstGenre)); ?>
</select></td>
<td><input name="submit" type="submit" id="submit" value="Refine Results" /></td>
</tr>
</table>
</form>
当我选择了汽车和国家时,数据看起来像这样...... pyt国家= 5 pyt-car = 999945
如果我将国家/地区更改为德国 (4) abd 选择法拉利 F12 (ID 999980),然后它会返回此... pyt国家= 4 pyt-car = 999945
所以发送的是国家,而不是汽车。
源代码如下所示:
<form action="index2.php" method="post" name="plan-your-trip" id="plan-your-trip">
<table border="0" align="right" cellpadding="0" cellspacing="5">
<tr>
<td><select name="pyt-country" id="pyt-country">
<option value="%" >Any Country...</option>
<option value="1" >Switzerland</option>
<option value="2" >France</option>
<option value="3" >Italy</option>
<option value="4" >Germany</option>
<option value="5" selected="selected">Austria</option>
</select></td>
<td>
<div class="carAll">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999979" >Aston Martin V12 Vanquish</option>
<option value="999993" >Aston Martin V8 Vantage Coupe</option>
<option value="999925" >Aston Martin V8 Vantage S</option>
<option value="9999100" >Aston Martin Vantage Roadster</option>
<option value="999995" >Aston Martin Virage Volante V12 </option>
<option value="999960" >Audi R8 Spyder V10</option>
<option value="999916" >Audi S5 Cabriolet</option>
<option value="999989" >Audi S5 Sportback</option>
<option value="999951" >Bentley GT V8</option>
<option value="999982" >Bentley GTC V8</option>
<option value="999912" >BMW Z4 sDrive35is </option>
<option value="999931" >Ferrari California</option>
<option value="999980" >Ferrari F12</option>
<option value="999972" >Ferrari F458 Spider</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="9999102" >Lamborghini Murcielago Roadster LP640</option>
<option value="999981" >McLaren MP4-12C Spider</option>
<option value="999991" >Mercedes CLA 250</option>
<option value="999917" >Mercedes E Class Cabriolet</option>
<option value="999985" >Mercedes SLS Roadster</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999994" >Porsche 911 C2S Coupe</option>
<option value="999920" >Porsche 981 Boxster S</option>
<option value="999984" >Porsche Cayenne S</option>
<option value="999946" >Porsche Panamera GTS</option>
<option value="999969" >Range Rover Evoque</option>
<option value="999938" >Range Rover Sport V8 </option>
</select>
</div>
<div class="carSw">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999993" >Aston Martin V8 Vantage Coupe</option>
<option value="999925" >Aston Martin V8 Vantage S</option>
<option value="9999100" >Aston Martin Vantage Roadster</option>
<option value="999995" >Aston Martin Virage Volante V12 </option>
<option value="999916" >Audi S5 Cabriolet</option>
<option value="999951" >Bentley GT V8</option>
<option value="999931" >Ferrari California</option>
<option value="999980" >Ferrari F12</option>
<option value="999972" >Ferrari F458 Spider</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="9999102" >Lamborghini Murcielago Roadster LP640</option>
<option value="999917" >Mercedes E Class Cabriolet</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999994" >Porsche 911 C2S Coupe</option>
<option value="999920" >Porsche 981 Boxster S</option>
<option value="999946" >Porsche Panamera GTS</option>
<option value="999969" >Range Rover Evoque</option>
</select>
</div>
<div class="carFr">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999960" >Audi R8 Spyder V10</option>
<option value="999982" >Bentley GTC V8</option>
<option value="999931" >Ferrari California</option>
<option value="999980" >Ferrari F12</option>
<option value="999972" >Ferrari F458 Spider</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="999981" >McLaren MP4-12C Spider</option>
<option value="999985" >Mercedes SLS Roadster</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999920" >Porsche 981 Boxster S</option>
</select>
</div>
<div class="carIt">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999993" >Aston Martin V8 Vantage Coupe</option>
<option value="999925" >Aston Martin V8 Vantage S</option>
<option value="9999100" >Aston Martin Vantage Roadster</option>
<option value="999995" >Aston Martin Virage Volante V12 </option>
<option value="999916" >Audi S5 Cabriolet</option>
<option value="999951" >Bentley GT V8</option>
<option value="999931" >Ferrari California</option>
<option value="999980" >Ferrari F12</option>
<option value="999972" >Ferrari F458 Spider</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="9999102" >Lamborghini Murcielago Roadster LP640</option>
<option value="999917" >Mercedes E Class Cabriolet</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999920" >Porsche 981 Boxster S</option>
<option value="999946" >Porsche Panamera GTS</option>
</select>
</div>
<div class="carGer">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999925" >Aston Martin V8 Vantage S</option>
<option value="9999100" >Aston Martin Vantage Roadster</option>
<option value="999916" >Audi S5 Cabriolet</option>
<option value="999951" >Bentley GT V8</option>
<option value="999931" >Ferrari California</option>
<option value="999980" >Ferrari F12</option>
<option value="999972" >Ferrari F458 Spider</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="9999102" >Lamborghini Murcielago Roadster LP640</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999994" >Porsche 911 C2S Coupe</option>
<option value="999920" >Porsche 981 Boxster S</option>
<option value="999946" >Porsche Panamera GTS</option>
</select>
</div>
<div class="carAus">
<select name="pyt-car" id="pyt-car">
<option value="%" >Any Car...</option>
<option value="999980" >Ferrari F12</option>
<option value="999996" >Jaguar F-Type V8</option>
<option value="999998" >Lamborghini Aventador</option>
<option value="9999101" selected="selected">Lamborghini Gallardo LP570</option>
<option value="9999102" >Lamborghini Murcielago Roadster LP640</option>
<option value="999945" >Porsche 911 C2S Cabrio</option>
<option value="999994" >Porsche 911 C2S Coupe</option>
<option value="999920" >Porsche 981 Boxster S</option>
</select>
</div>
</td>
<td> </td>
</tr>
<tr>
<td><select name="pyt-month" id="pyt-month">
<option value="%" selected="selected">Any Month...</option>
<option value="01">January</option>
<option value="02">February</option>
<option value="03">March</option>
<option value="04">April</option>
<option value="05">May</option>
<option value="06">June</option>
<option value="07">July</option>
<option value="08">August</option>
<option value="09">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select></td>
<td><select name="pyt-style" id="pyt-style">
<option value="%" selected="selected">Any Break Style...</option>
<option value="8881" >Gourmet & Wine</option>
<option value="8882" >Historic & Castles</option>
<option value="8885" >Honeymoon & Romantic</option>
<option value="88811" >Greatest Driver Roads</option>
<option value="88812" >James Bond Inspired</option>
<option value="88813" >Jet Set</option>
<option value="88814" >Multi Country Tours</option>
<option value="88815" >Porsche Celebration</option>
<option value="88816" >Natural spas</option>
</select></td>
<td><input name="submit" type="submit" id="submit" value="Refine Results" /></td>
</tr>
</table>
</form>
我删除了侦听 POST 并隐藏 DIVS 的初始 jquery 即
if (countryid == "%") {
$('.carAll').css('display', 'block');
$('.carSw').css('display', 'none');
$('.carFr').css('display', 'none');
$('.carIt').css('display', 'none');
$('.carGer').css('display', 'none');
$('.carAus').css('display', 'none');
}
然后一切正常,但是,当页面加载时,它会返回完整的汽车列表,但我希望它记住我选择了一个国家,只显示与该国家相关的 DIV 并隐藏其他DIVS,直到选择另一个国家。
【问题讨论】:
标签: javascript php jquery forms get