我正在选择Make,Model和Year。
基于品牌和型号值的年份显示基于年份。
这是一个截屏。
我希望在检查值时它会附加在上面的复选框中,例如
当我选择make optioin “PRI”时,2005年和“模型”的值为“PRIMODE,Temp pri ”然后我选择Make选项“Yamaha ”,2006年,模型FZ1的值将显示在下一行并保持旧(make选项PRI值)等等......
这是我的代码。
HTML
<div id="make_parent" style="font-size:15px"></div>
jQuery脚本
<script>
var checked, checkedValues = new Array();
//var iCnt = 0;
var newhtml = '';
var status = 'true';
jQuery(document).on("change", "input[type=checkbox]", function(e) {
var str = '';
var existhtml;
jQuery("#frame .model_val").each(function() {
if(jQuery(this).prop('checked') === true){
str = str + jQuery(this).val()+' ,';
}
str1 = str.slice(0, -1);
newhtml = '<div class="make_'+jQuery("#mec_make").val()+'">'+jQuery("#mec_make").val()+'<div class="year_'+jQuery("#car_year_select").val()+'">'+jQuery("#car_year_select").val()+'<div class="model">'+str1+'</div></div></div>';
});
jQuery("#make_parent div").each(function (index, element)
{
if(jQuery(element).hasClass('make_'+jQuery("#mec_make").val())) {
status = 'false';
jQuery('.make_'+jQuery("#mec_make").val() + " div").each(function (index1, element1)
{ //alert('fd');
if(jQuery(element1).hasClass('year_'+jQuery("#car_year_select").val())) {
jQuery('.year_'+jQuery("#car_year_select .model").val()).append(str1);
}
else
{
//alert('make_'+jQuery("#mec_make").val()+"-- year_"+jQuery("#car_year_select").val());
jQuery('.make_'+jQuery("#mec_make").val()).append('<div class="year_'+jQuery("#car_year_select").val()+'">'+jQuery("#car_year_select").val()+'<div class="model">'+str1+'</div></div>');
}
});
}
else
{
existhtml = jQuery('#make_parent').html();
jQuery("#make_parent").html(existhtml+newhtml);
}
});
if(status == 'true')
{
existhtml = jQuery('#make_parent').html();
jQuery("#make_parent").html(existhtml+newhtml);
}
});
</script>
我尝试通过上面的代码进行操作,但它不能按我的意愿工作,它一直显示重复。
我希望输出像..
等等..