我有HTML AJAX形式結構象下面這樣:可以nextAll()跳過任何指定的父元素並只查找父級內的子元素嗎?
<form name="vafForm" id="vafForm" method="GET" action="urlfor ajax">
<input type="hidden" value="0" id="vafProduct">
<!--<div id="catalog-collection" class="select">-->
<select class="catSelect {prevLevelsIncluding: 'cat'} cat" name="cat" id="catalog" data-level="0">
<option value="0">- Select Cat -</option>
<option value="1">
Federal </option>
<option selected="selected" value="2">
California </option>
</select>
<!--</div>-->
<!--<div id="year-collection" class="select">-->
<select class="yearSelect {prevLevelsIncluding: 'cat,year'} year" name="year" id="year" data-level="1"><option value="0">- Select Year -</option><option value="7">2016</option><option value="3">2012</option></select>
<!--</div>-->
<!--<div id="make-collection" class="select">-->
<select class="makeSelect {prevLevelsIncluding: 'cat,year,make'} make" name="make" id="make" data-level="2"><option value="1">Acura</option></select>
<!--</div>-->
<!--<div id="model-collection" class="select">-->
<select class="modelSelect {prevLevelsIncluding: 'cat,year,make,model'} model" name="model" id="model" data-level="3"><option value="2">Ultra</option></select>
<!--</div>-->
<!--<div id="litre-collection" class="select">-->
<select class="litreSelect {prevLevelsIncluding: 'cat,year,make,model,litre'} litre" name="litre" id="litre"><option value="6">6</option></select>
<!--</div>-->
<div align="center">
<input type="button" style=" padding:5px; margin:5px;" value="Clear" class="vafClear"><input type="button" style=" padding:5px; margin:5px;" class="vafSubmit" value="Submit">
</div>
</form>
這是工作(當選擇的第一選擇框,那麼下一個加載有由AJAX相關數據)如果所有的select
框是彼此相鄰,但對於設計問題,我需要在所有選擇框周圍添加<div>
,並讓它們也可以通過ajax下拉選擇進行工作。
現在我正在使用jQuery的nextAll
函數,在結構更改時這不是一個好的選擇。所以任何人都可以指導我如何在所有選擇框周圍使用div
?
我目前使用的腳本如下:
if(jQuery('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_startSelect').size()) {
var url = getUrl(jQuery(this).parent('form'), '<?=str_replace(' ','_',$levels[ $i + 1 ])?>');
alert(jQuery('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_startSelect').val());
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_startSelect').html(loadingText);
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_endSelect').html(loadingText);
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_startSelect').load(url, {}, function(responseText) {
jQuery(this).html(responseText);
callbackFunc.apply(this);
});
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>_endSelect').load(url, {}, function(responseText) {
jQuery(this).html(responseText);
callbackFunc.apply(this);
});
} else {
if(jQuery('.<?=str_replace(' ','_',$levels[ $i ])?>Select').val() != "0")
{
var url = getUrl(jQuery(this).parent('form'), '<?=str_replace(' ','_',$levels[ $i + 1 ])?>');
var NewVar = jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>Select').html(loadingText);
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>Select').html(loadingText);
jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>Select').load(url, {}, function(responseText) {
jQuery(this).html(responseText);
callbackFunc.apply(this);
});
}
else
{
//jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>Select').html('<option></option>').attr('disabled','disabled');
//jQuery(this).nextAll('.<?=str_replace(' ','_',$levels[ $i + 1 ])?>Select').prop('disabled', true);
jQuery(this).nextAll('select').each(function() {
//jQuery(this).html('<option></option>').prop('disabled',true);
jQuery(this).prop('disabled',true);
});
}
}
我沒有太大的腳本傢伙。
在js所有的PHP?你真的需要這樣做嗎? – 2016-01-21 06:10:47
這是一個預建模塊,這是我在許多網站使用的模塊的默認代碼,但只是爲了這個網站,我需要在選擇框中添加div。我正在尋找的是'nextAll'替代方法,即使它們被各自的div標籤包圍,也可以獲得所有選擇框 –
爲什麼你的類以這種方式命名 - yearSelect {prevLevelsIncluding:'cat,year'} year'? –