网页实现分页,翻页按钮,jquery对select的获取,设置总结【亲测有效】

     js和jquery操作select很魔性,也可以说是挺麻烦的,有时候好多都不生效,经过本人的多时间尝试,总结了一些比较好用的,一下均基于jquery首先是设置select的选中项

$("#selectId").find("option[value='val']").prop("selected", true);  //设置option的属性
$("#selectId").val("text");    //直接设置select的值
  • 第一种是将每个option元素都加上value属性,和他的值,这样可以通过value筛选;
  • 第二种比较直接,就是将select的 值 设置为 option的text,并且也是直接选中,两个方法都不会触发select的change()方法,需要自己再写切换后的部分
$("#selectId").change()   //非手动点击option无法触发

不过相对来说第二种简单些。
     但是如果要获得当前选中的option的元素,则为:

$("#selectId").find("option:selected")

再加上prev()/next(),和prop(‘selected’, true),就可以实现上下临近选择。即:

$("#selectId").find("option:selected").prev().prop('selected', true);  //选中上一个选项
$("#selectId").find("option:selected").next().prop('selected', true);  //选中下一个选项

(注:这里使用 prop(‘selected’, true) 而不是attr(‘selected’, true),后者可能只会生效一次,目前还不知道其原因)

猜你喜欢

转载自blog.csdn.net/weixin_42822484/article/details/100146301