实现商品下拉框筛选

我们在购买商品的时候会出现下拉框供我们选择商品的类型或者想要便宜一点的商品,我们对商品进行排序等;那么如何实现呢?我在写项目的时候遇到了这个功能,我给大家讲一下我的实现思路。

首先,我们先先写一个select框,设置框内的option的value值,并且给select框绑定onchange事件,每次触发一次事件之后都会进行判断。判断当前点击的option的value值是否等于我们设置的value值,相等就通过sort方法对数据进行排序渲染数据。
 

<select name="" id="box" onchange="fn()">
	<option value="1">你好</option>
	<option value="2">呵呵</option>
</select>
function fn(){
    let box = document.getElementById("box").value;
	if (box == 1) {
		console.log(11111);
	}else{
		console.log(22222);
	}
}

 这只是我写的简单的实例,用打印来代替渲染数据了。 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值