利用jQuery判断某值,移除特定的html元素

当时我在做一个地产相关的网站项目,主要使用K2组件,还有一个K2搜索的模块。

Demo页面:http://ecs.ycway.cn/office-rent/itemlist/filter.html?searchword1=%E6%B5%B7%E6%B7%80&moduleId=41&Itemid=7

K2搜索模块需要定制,目标是实现点击一个区域,然后显示下级区域。

正常来说这是一个选择联动的功能,由于当时版本的K2搜索模块并不支付联动功能。

所以只能换思路实现,就是把所有的二级区域作为一个单选字段。

当点击某个一级区域,用jQuery做判断,把不相关的二级区域元素移除,这样就可以只显示相关的二级区域元素。

具体的实现方式:

<script type="text/javascript">
jQuery(document).ready(function() {
var radio1 = jQuery(".k2filter-field-1 .active"); //构造函数radio1,利用选择器指定范围
var radio2 = jQuery(".k2filter-field-2"); //构造函数radio2,利用选择器指定范围
if(radio1.html() == "New York") {   //比较函数radio1指定的范围内的HTML的值
radio2.find("a:eq(3),br:eq(3), a:eq(4), br:eq(4), a:eq(5), br:eq(5), a:eq(6), br:eq(6), a:eq(7), br:eq(7), a:eq(8),  br:eq(8)").remove();//利用选择器指定范围eq()的jQuery历遍方法,找出指定排序的超链接元素a和换行符br,将其符条件的html元素移除
}
if(radio1.html() == "Paris") {
radio2.find("a:eq(0), br:eq(0), a:eq(1), br:eq(1), a:eq(2), br:eq(2), a:eq(6), br:eq(6), a:eq(7), br:eq(7), a:eq(8), br:eq(8)").remove();
}
if(radio1.html() == "Hong Kong") {
radio2.find("a").slice(0,6).remove();//利用选择器指定范围slice()的jQuery历遍方法,找出指定排序的超链接元素a将其符条件的html元素移除
radio2.find("br").slice(0,6).remove();
}
});
</script>
  • 作者:野草工作室
  • 发布日期:2018-02-20
  • 文章标签: Joomla模板

文章评论功能仅对网站会员开放,请先 登录 注册

栏目公告

原野草工作室官网的博客栏目的文章,会逐步迁移至Joomla建站笔记栏目。

Joomla主机