我遇到了 jQuery 和 AJAX 的问题。 我有3个选择标签,其值通过 AJAX 填充。
这是我需要的情况。
当我在第一个选择标签上选择选项时,我在第二个选择标签中获得特定值。 然后,当我在第二个标签上选择选项时,我会在第三个选择标签中获得特定值。 在第三个选择标签中选择选项后 - 提交发生。 这部分有效。
当然提交后一切都重置了。我不想这样,所以我把选择标签中的选中。现在我不知道如何“直播”从第一个和第二个选择标记中读取,以便在提交选项保持填充后。
以下是我的代码 PHP / HTML 代码:
<form action="<?php echo $PHP_SELF; ?>" method="POST" name="userVideos" id="userVideos" style="width: 580px; margin-left: 5px; margin-bottom: 2px;">
<select name="brand_select" id="brand_select" style="width: 140px; margin-right: 20px;">
<option value="">Select Brand</option>
<?php
$query_brands = mysql_query("SELECT DISTINCT brand FROM users_video WHERE location = '2' ORDER BY brand");
while ($row = mysql_fetch_object($query_brands))
{
$name = $row->brand;
$sel = ($_POST['brand_name'] == $name) ? "selected='selected'" : "";
echo "<option value='{$row->brand}' $sel>{$row->brand}</option>";
}
?>
</select>
<input type="hidden" value="<?php echo htmlspecialchars($_POST['brand_select']); ?>" name="brand_name" id="brand_name"/>
<select name="series_select" id="series_select" style="width: 140px; margin-right: 20px;" disabled>
<option value="">Select Series</option>
<?php
//TODO: finish code tidification
$sel = ($_POST['series_name'] != "") ? "selected='selected'" : "";
echo "<option value='" . htmlspecialchars($_POST['series_name']) . "' $sel>" . htmlspecialchars($_POST['series_name']) . "</option>";
?>
</select>
<input type="hidden" value="" name="series_name" id="series_name"/>
<select name="model_select" id="model_select" style="width: 140px; margin-right: 20px;" disabled>
<option value="">Select Model</option>
<?php
$sel = ($_POST['model_name'] != "") ? "selected='selected'" : "";
echo "<option value='" . htmlspecialchars($_POST['model_name'] != "") . "' $sel>" . htmlspecialchars($_POST['model_name']) . "</option>";
?>
</select>
<input type="hidden" value="" name="model_name" id="model_name"/>
</form>
这是我的 jQuery 代码:
jQuery(document).ready(function(){
var brand = "";
var series = "";
var model = "";
var _brand = "";
_brand = $('#brand_name').val();
$("#brand_select").live("change", function(){
brand = $('select#brand_select').val();
if (brand == "" && _brand == "")
{
$('select#series_select').attr('disabled','disabled');
$('#model_select').attr('disabled','disabled');
}
else
{
$('select#series_select').removeAttr('disabled');
$('#brand_name').val(brand);
var grbData = $.ajax({
type: "GET",
url: "series.php",
data: "brand=" + brand,
success: function(html){
$("#series_select").html(html);
}
});
}
});
$("#series_select").change(function(){
series = $('select#series_select').val();
if (series != ""){
$('#model_select').removeAttr('disabled');
$('#series_name').val(series);
var newData = $.ajax({
type: "GET",
url: "model.php",
data: "brand=" + brand + "&series=" + series,
success: function(html){
$("#model_select").html(html);
}
});
}else{
$('#model_select').attr('disabled','disabled');
}
});
$("#model_select").change(function(){
model = $('select#model_select').val();
if (model != ""){
$('#model_name').val(model);
$('#userVideos').submit();
}
});
答案 0 :(得分:0)
为了简单起见,请尝试这样的事情。给他们所有相同的类,但使用ID为品牌或系列。我写这篇文章时没有测试抱歉,但你可以将所有功能都转移到1.你需要调整的基本想法。我甚至可能用静态变量复杂化它。但至少你可以跟踪价值观。
$(".series_select").change(function(){
var value = $(this).val(),
type = $(this).attr('id'),
data,
self = $(this);
if(type == "brand"){
data = "brand=" + value;
$(".series_select").change.brand = value;
} else if (type == "series"){
data = "brand=" + $(".series_select").change.brand + "&series=" + value;
$(".series_select").change.series = value;
} else if( type == "submit"){
if($(".series_select").change.brand != '' && $(".series_select").change.series != ''){
$('#userVideos').submit();
return;
}
}
$.ajax({
type: "GET",
url: "model.php",
data: data,
success: function(html){
self.html(html);
}
});
});