You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
498 lines
16 KiB
498 lines
16 KiB
/*
|
|
* JQuery版本: jquery1.9.1
|
|
* 名称:仿大商创多条件筛选插件JS效果
|
|
* 时间:2014-12-15 15:23:29
|
|
* 拼音插件: pinyin.js
|
|
* css:样式文件 select.css
|
|
* 颜色和品牌 单独从数组里获取的 样式和 下面的是分开的 写的比较繁琐见谅
|
|
*/
|
|
|
|
$(function(){
|
|
var choose_more = $(".choose_more"),
|
|
choose_open = $(".choose_open"),
|
|
brands = $(".brand_img"),
|
|
same_li = $(".same_li"),
|
|
click_more = $(".click_more"),
|
|
attr_father = $(".attr_father"),
|
|
color_list_color = $(".color_list_color"),
|
|
sure_color = $(".sure_color"),
|
|
item_list = $(".item_list"),
|
|
no_btn = $(".no_btn"),
|
|
sameHeight = 0;
|
|
|
|
//隐藏更多属性
|
|
same_li.find(".attr_son").each(function() {
|
|
var $this = $(this);
|
|
sameHeight = $this.outerHeight();
|
|
if(sameHeight>40){
|
|
$this.find('.item_list').addClass('ohide');
|
|
$this.parents('.same_li').find('.choose_open').show();
|
|
}
|
|
});
|
|
|
|
// 选中商品属性时 出现
|
|
if($('.u_cloose dl dd div').length==0){
|
|
$('.u_cloose').css('display','none');
|
|
}
|
|
|
|
// 超过5项隐藏 给添加属性
|
|
if($('.attr_father > li').length>5){
|
|
$('.click_more .strong').text();
|
|
$('.attr_father > li:gt(4)').css('display','none');
|
|
$('.attr_father > li').eq(4).find(".attr_son").css({"border-bottom":0});
|
|
$('.attr_father > li:gt(4)').attr('donone','do_none');
|
|
}
|
|
|
|
if($('.attr_father > li').length<=5){
|
|
$('.click_more span').css('display','none');
|
|
}
|
|
|
|
// 获取被隐藏的选项栏目名称
|
|
var li_none=$(".attr_father >li[donone='do_none']");
|
|
var k_name="";
|
|
for (var i = 0; i < li_none.length; i++) {
|
|
k_name+=li_none.eq(i).find('dt').text().replace(" :","")+"、";
|
|
};
|
|
k_name=k_name.substring(0,k_name.length-1);
|
|
$('.click_more strong').text("更多选项");
|
|
|
|
// 隐藏更多选项
|
|
click_more.click(function(){
|
|
var gt =$('.attr_father > li:gt(4)');
|
|
if( gt.is(':hidden')){
|
|
gt.show();
|
|
$(this).find('i').addClass('up');
|
|
$(this).find('strong').text('收起');
|
|
$('.u_get').parents('li').remove();
|
|
if($(".attr_father .same_li").length<=2){
|
|
alert("没有更多属性了");
|
|
$(".click_more").find("span").remove();
|
|
}
|
|
}else{
|
|
gt.hide();
|
|
$(this).find('i').removeClass('up');
|
|
$('.click_more strong').text('更多选项');
|
|
}
|
|
})
|
|
|
|
// 可选项只有1项时 隐藏多选框
|
|
choose_more.each(function(){
|
|
var this_bt=$(this).siblings('.attr_son').find('.ietm_list').find('dd').length;
|
|
if(this_bt==1){
|
|
$(this).hide();
|
|
}
|
|
})
|
|
|
|
var lt_a=$(".get_item").length;
|
|
var lt_b=$(".attr_father>li").length+2;
|
|
if(lt_a>=lt_b){
|
|
$('.click_more').remove();
|
|
}
|
|
|
|
// 品牌搜索
|
|
$(".input_search input").keyup(function(){
|
|
//多选拼音中文搜索
|
|
var pinyin = codefans_net_CC2PY($(this).val());
|
|
$('.get_more li').css('display','none');
|
|
$('.get_more li a').each(function(){
|
|
if(codefans_net_CC2PY($(this).text()).toLowerCase()==pinyin.toLowerCase()){
|
|
$(this).parents('li').css('display','block');
|
|
}
|
|
})
|
|
|
|
// 单项中文拼音搜索
|
|
if($('.wrap_brand').is(':visible')){
|
|
$('.brand_img_word').css('display','none');
|
|
$('.brand_img_word').each(function(){
|
|
if(codefans_net_CC2PY($(this).find('strong').text()).toLowerCase()==pinyin.toLowerCase()){
|
|
$(this).css('display','block');
|
|
}
|
|
|
|
if(codefans_net_CC2PY($(this).find('b').text()).toLowerCase()==pinyin.toLowerCase()){
|
|
$(this).css('display','block');
|
|
}
|
|
})
|
|
}
|
|
});
|
|
|
|
// 品牌单选多选跳转
|
|
$('.yes_bt').click(function(){
|
|
var brand_total=$('.is_yes').length;
|
|
if(brand_total==1){
|
|
var brand_url=$('.is_yes').find('a').data("url");
|
|
window.location=brand_url;
|
|
}
|
|
if(brand_total>1){
|
|
var brand_arr=new Array();
|
|
var bra="";
|
|
for (var d = 0; d < brand_total; d++) {
|
|
brand_arr[d]=$('.is_yes').eq(d).attr('url_id');
|
|
};
|
|
|
|
for (var e = 0; e < brand_arr.length; e++) {
|
|
bra+=brand_arr[e]+",";
|
|
};
|
|
bra=bra.substring(0,bra.length-1);
|
|
var brand_url=$('.is_yes').find('a').eq(1).data("url");
|
|
|
|
burl=brand_url.substring(brand_url.indexOf("brand="),brand_url.indexOf('&price'));
|
|
|
|
bra="brand="+bra;
|
|
burl=brand_url.replace(burl,bra);
|
|
window.location=burl;
|
|
}
|
|
})
|
|
|
|
// 其他多选
|
|
$('.sure_I').each(function(){
|
|
$(this).click(function(){
|
|
var get_this=$(this).parents(".tw_buttom").siblings(".item_list").find(".selected");
|
|
if(get_this.length==1){
|
|
var g_href=$('.selected a').data("url");
|
|
window.location=g_href;
|
|
}
|
|
if(get_this.length>1){
|
|
var selected_lenght = get_this.length;
|
|
var selected_array=new Array();
|
|
var on="";
|
|
for (var a = 0; a < selected_lenght; a++) {
|
|
selected_array[a]=get_this.eq(a).attr('url_id');
|
|
};
|
|
for (var b = 0; b < selected_array.length; b++) {
|
|
on+=selected_array[b]+",";
|
|
};
|
|
on=on.substring(0,on.length-1);
|
|
var o_url_id=get_this.eq(1).attr('url_id');
|
|
var o_url = get_this.find('a').eq(1).data("url");
|
|
if(o_url.indexOf(o_url_id)>0){
|
|
o_url=o_url.replace(o_url_id,on);
|
|
}
|
|
window.location=o_url;
|
|
}
|
|
})
|
|
})
|
|
|
|
// 颜色 单选和多项情况下的确定
|
|
sure_color.click(function(){
|
|
var selected = color_list_color.find('.selected');
|
|
if(selected.length==1){
|
|
window.location=selected.find("a").data("url");
|
|
}
|
|
if(selected.length>1){
|
|
var color_arr=new Array();
|
|
var cc="";
|
|
for (var i = 0; i < selected.length; i++) {
|
|
color_arr[i]= selected.eq(i).attr('url_id');
|
|
};
|
|
for (var k = 0; k < color_arr.length; k++) {
|
|
cc+=color_arr[k]+",";
|
|
};
|
|
cc=cc.substring(0,cc.length-1);
|
|
var url_id=selected.eq(1).attr('url_id');
|
|
var c_url=selected.find("a").eq(1).data("url");
|
|
if(c_url.indexOf(url_id)>0){
|
|
c_url=c_url.replace(url_id,cc);
|
|
}
|
|
window.location=c_url;
|
|
}
|
|
})
|
|
|
|
// 还原选项
|
|
$('.get_item').click(function(){
|
|
window.location=$(this).find('a').attr('href');
|
|
});
|
|
|
|
$('.u_get').each(function() {
|
|
$(this).parents('li').css('display','none'); // 隐藏选项
|
|
});
|
|
|
|
$('.input_search input').blur(function(){
|
|
$(this).val('可输入汉字,拼音查找品牌');
|
|
}).focus(function(){
|
|
$(this).val('');
|
|
});
|
|
|
|
$('.attr_father > li:last').find(".attr_son").css({"border-bottom":0});
|
|
$('.brand_div .brand_img_word:gt(17)').css('display','none'); // 隐藏大于8索引的品牌图片保留需要的1排
|
|
|
|
$('.brand_div > div').mouseover(function(){
|
|
$(this).find('img').css('display','none');
|
|
$(this).find('strong').css('display','block');
|
|
}).mouseout(function(){
|
|
$(this).find('img').css('display','block');
|
|
$(this).find('strong').css('display','none');
|
|
});
|
|
|
|
choose_open.click(function(){
|
|
var $this = $(this),
|
|
brands = $this.parents(".brand_img"),
|
|
attr_list = $this.parents('.attr_list');
|
|
|
|
function All(){
|
|
if(attr_list.hasClass("extend")){
|
|
brands.removeClass("extend");
|
|
brands.find('.brand_img_word').show();
|
|
brands.find('.brand_div .brand_img_word:gt(17)').hide();
|
|
$this.children().removeClass("icon_down");
|
|
}else{
|
|
attr_list.addClass("extend");
|
|
//brands.find('.input_search').children().val('可输入汉字,拼音查找品牌');
|
|
brands.find('.brand_img_word').show();
|
|
$this.children().addClass("icon_down");
|
|
}
|
|
}
|
|
|
|
if(!attr_list.hasClass("multiple")){
|
|
All();
|
|
}else{
|
|
alert("请收起全部多选");
|
|
}
|
|
})
|
|
|
|
$('.get_more li').click(function(){
|
|
var $this = $(this),length;
|
|
if($this.hasClass('is_no')){
|
|
$this.removeClass('is_no').addClass('is_yes');
|
|
}else{
|
|
$this.removeClass('is_yes').addClass('is_no');
|
|
}
|
|
|
|
length = $this.parent().find('.is_yes').length;
|
|
if(length == 0){
|
|
$(".yes_bt").addClass("disabled");
|
|
}else if(length>0&&length<5){
|
|
$(".yes_bt").removeClass("disabled");
|
|
}else if(length>5){
|
|
$(this).attr("class","is_no");
|
|
alert('最多只能选择5项');
|
|
return false;
|
|
}
|
|
});
|
|
|
|
$('.no_bt').click(function(){
|
|
$(this).parents('.brand_img').removeClass('multiple');
|
|
$('.get_more li').css('display','block');
|
|
$(this).parents('.brand_img').find(".sl-ext").removeClass("down");
|
|
$(this).parents('.brand_img').find(".choose_more").html("<i class='icon'></i>多选");
|
|
});
|
|
|
|
choose_more.click(function(){
|
|
var $this = $(this);
|
|
var brands = $this.parents(".brand_img");
|
|
var attr_list = $this.parents(".attr_list");
|
|
var same_li = $this.parents(".same_li");
|
|
var slExt = $this.parent();
|
|
|
|
function slext(){
|
|
var li = attr_list.addClass("multiple").parents("li");
|
|
if(slExt.hasClass("down")){
|
|
slExt.removeClass("down");
|
|
$this.html("<i class='icon'></i>多选");
|
|
|
|
brands.removeClass("multiple");
|
|
attr_list.removeClass("multiple");
|
|
attr_list.find("dd").removeClass("get_me");
|
|
attr_list.find("a").removeAttr("onclick");
|
|
}else{
|
|
slExt.addClass("down");
|
|
$this.html("<i class='icon'></i>收起");
|
|
|
|
brands.find(".get_more li").removeClass("is_yes").addClass("is_no");
|
|
brands.find(".yes_bt").addClass("disabled");
|
|
|
|
brands.removeClass("extend");
|
|
brands.find(".icon_all").removeClass("icon_down");
|
|
brands.find('.brand_img_word:gt(17)').css('display','none');
|
|
brands.addClass("multiple").parents("li").siblings().find(".multiple").removeClass("multiple");
|
|
|
|
//attr_list.find("a").removeAttr('href');
|
|
|
|
same_li.find("dd").addClass("get_me");
|
|
|
|
li.siblings().find(".multiple").removeClass("multiple");
|
|
li.siblings().find("dd").removeClass("get_me");
|
|
li.siblings().find(".sure").addClass("disabled");
|
|
li.siblings().find("dd").removeClass("selected");
|
|
li.siblings().find("a").removeAttr('onclick');
|
|
li.siblings().find(".sl-ext").removeClass("down");
|
|
li.siblings().find(".choose_more").html("<i class='icon'></i>多选");
|
|
}
|
|
}
|
|
|
|
if(!attr_list.hasClass("extend")){
|
|
slext();
|
|
}else{
|
|
alert("请收起全部单选");
|
|
}
|
|
});
|
|
|
|
//其他多选属性
|
|
item_list.find("dd").click(function(){
|
|
var length;
|
|
if($(this).hasClass("selected")){
|
|
$(this).removeClass("selected");
|
|
}else{
|
|
$(this).addClass("selected");
|
|
}
|
|
|
|
length = $(this).parents(".item_list").find(".selected").length;
|
|
|
|
if(length == 0){
|
|
$(this).parents('.attr_list').find(".sure").addClass("disabled");
|
|
}else if(length>0 && length<5){
|
|
$(this).parents('.attr_list').find(".sure").removeClass("disabled");
|
|
}else if(length>5){
|
|
alert('不能超过5项');
|
|
$(this).removeClass("selected");
|
|
return false;
|
|
}
|
|
});
|
|
|
|
// 价格的文本框验证是否为数字 以及小数转换 非负 非小数
|
|
$('.price_auto input').blur(function(){
|
|
if($(this).val().length>0){
|
|
$(this).css('border','#ccc 1px solid');
|
|
}
|
|
if(isNaN($(this).val())){
|
|
$(this).val("");
|
|
}else{
|
|
var in_num=Math.abs(Math.floor($(this).val())); //自动转换为正整数
|
|
if(in_num==0){
|
|
in_num="";
|
|
}
|
|
$(this).val(in_num);
|
|
}
|
|
})
|
|
|
|
// 输入的值做安全验证以及大小值交换处理 为空提示
|
|
$('.price_ok').click(function(){
|
|
if($('.price_min').val().length==0||$('.price_max').val().length==0){
|
|
if($('.price_min').val().length==0){
|
|
$('.price_min').css('border','#ff0000 1px solid');
|
|
}else{
|
|
$('.price_min').css('border','#ccc 1px solid');
|
|
}
|
|
if($('.price_max').val().length==0){
|
|
$('.price_max').css('border','#ff0000 1px solid');
|
|
}else{
|
|
$('.price_max').css('border','#ccc 1px solid');
|
|
}
|
|
return false;
|
|
}else{
|
|
min_p=parseInt($('.price_min').val());
|
|
max_p=parseInt($('.price_max').val());
|
|
if(min_p>max_p){
|
|
price_arr=[min_p,max_p];
|
|
min_p=price_arr[1];
|
|
max_p=price_arr[0];
|
|
}else if(min_p==max_p){
|
|
min_p=1;
|
|
}
|
|
}
|
|
var link=window.location.href;
|
|
var lk="price_min="+min_p+"&price_max="+max_p; // 获取的 url
|
|
if(link.indexOf('price_min')<0){
|
|
link=link+"&"+lk;
|
|
window.location=link;
|
|
}
|
|
|
|
if(link.indexOf('price_min')>0){
|
|
var max_lk=GetQueryString('price_max');
|
|
var min_lk=GetQueryString('price_min');
|
|
b_link="price_min="+min_lk+"&price_max="+max_lk; //之前的 url
|
|
link=link.replace(b_link,lk);
|
|
window.location=link;
|
|
}
|
|
})
|
|
|
|
// 取消当前多选选项
|
|
no_btn.click(function(){
|
|
var attr_list = $(this).parents(".attr_list");
|
|
attr_list.removeClass("multiple");
|
|
attr_list.find("dd").removeClass("selected");
|
|
attr_list.find("dd").find("a").removeAttr('onclick');
|
|
attr_list.find("dd").removeClass("get_me");
|
|
attr_list.find(".sl-ext").removeClass("down");
|
|
attr_list.find(".choose_more").html("<i class='icon'></i>多选");
|
|
});
|
|
|
|
// 放字母上下面的其他品牌隐藏
|
|
$('.a_z li').mouseover(function(){
|
|
var brands = choose_more.parents(".brand_img");
|
|
|
|
$(this).addClass("curr").siblings().removeClass("curr");
|
|
if(brands.hasClass("multiple")){
|
|
$('.all_brand').mouseover(function(){
|
|
$('.get_more li').css('display','block');
|
|
});
|
|
$('.a_z li').css('background','');
|
|
var M=$(this).data("key");
|
|
$('.get_more li').css('display','none');
|
|
$('.get_more li').each(function(){
|
|
if($(this).attr("brand") == M){
|
|
$(this).css('display','block');
|
|
}
|
|
});
|
|
}else{
|
|
$('.all_brand').mouseover(function(){
|
|
$('.brand_img_word').css('display','block');
|
|
});
|
|
var N=$(this).data("key");
|
|
$('.brand_img_word').css('display','none');
|
|
$('.brand_img_word').each(function(){
|
|
if($(this).attr("brand") == N){
|
|
$(this).css('display','block');
|
|
}
|
|
});
|
|
}
|
|
$('.other_brand').mouseover(function(){
|
|
$('.get_more li[brand=""]').css('display','block');
|
|
$('.brand_div .brand_img_word[brand=""]').css('display','block');
|
|
});
|
|
})
|
|
|
|
$('.all_brand').mouseover(function(){
|
|
$('.a_z li').css('background','');
|
|
})
|
|
|
|
function brand_letter(){ // 0、品牌字母初始化
|
|
$('.a_z li').css('background','');
|
|
$('.brand_img_word').css('display','block');
|
|
$('.brand_div .brand_img_word:gt(17)').css('display','none');
|
|
}
|
|
|
|
// 几种主要选项样式初始化
|
|
$('.ietm_list a').removeAttr('onclick');
|
|
function close_div(){ // 1、品牌样式初始化
|
|
$('.attr_father li').eq(0).css('background','');
|
|
$('.get_more li').attr('class','is_no');
|
|
$('.wrap_brand,.choose_open,.choose_more').css('display','block');
|
|
$('.brand_div .brand_img_word:gt(17),.all_a_z,.enter_yes_no,.zimu_list,.all_a_z').css('display','none');
|
|
$('.brand_div').css('margin','0px');
|
|
$('.wrap_brand').css('border','0 none').css('padding','0').css('height','auto');
|
|
$('.attr_color').find('b').removeClass('choose_color');
|
|
$('.price_auto input').css('border','#ccc 1px solid');
|
|
}
|
|
|
|
function color_choose(){ // 2、颜色多选项初始化
|
|
$('.Color_CS').css('display','block');
|
|
$('.Color_CS').parents('li').css('background','');
|
|
$('.Color_CS').parents('li').find('.tw_buttom').css('display','none');
|
|
$('.Color_CS').parents('li').find('b').removeAttr('class');
|
|
$('.color_list_color dd a').removeAttr('onclick');
|
|
}
|
|
|
|
function not_color(){ // 4、颜色下面的LI的当前选项状态初始化
|
|
$('.tw_buttom').css('display','none');
|
|
$('.attr_father li').css('background','');
|
|
$('.choose_more2').css('display','block');
|
|
$('.ietm_list dd').removeAttr('class');
|
|
}
|
|
|
|
|
|
function GetQueryString(name) {
|
|
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
|
|
var r = window.location.search.substr(1).match(reg);
|
|
if (r!=null) return unescape(r[2]); return null;
|
|
}
|
|
})
|