先来看效果
然后上代码:
先来DIV代码
<!-- 分类筛选 --> <div class="my-3"> <div class="row"> <div class="col-12 col-sm-2 col-md-1">类型:</div> <div class="col-12 col-sm-10 col-md-11"> <select class="footer_sel" id="FriendLink"> <option selected="selected" value="#">选择分类</option> {pboot:select field=ext_type} <option {pboot:if('[select:value]'=='[select:current]' )}selected="selected" {/pboot:if} value="[select:link]">[select:value]</option> {/pboot:select} </select> </div> </div> <div class="row"> <div class="col-12 col-sm-2 col-md-1">颜色:</div> <div class="col-12 col-sm-10 col-md-11"> <select class="footer_sel" id="FriendLink2"> <option selected="selected" value="#">选择分类</option> {pboot:select field=ext_color} <option {pboot:if('[select:value]'=='[select:current]' )}selected="selected" {/pboot:if} value="[select:link]">[select:value]</option> {/pboot:select} </select> </div> </div> </div>
然后JQ代码
<script> (function(window, $) { function init() { bindEvt(); } init(); function bindEvt() { $("#FriendLink").bind("change", function() { var selectedHref = $("#FriendLink :selected").val(); if (selectedHref != "") { window.open(selectedHref, "_self"); } }); } function init2() { bindEvt2(); } init2(); function bindEvt2() { $("#FriendLink2").bind("change", function() { var selectedHref = $("#FriendLink2 :selected").val(); if (selectedHref != "") { window.open(selectedHref, "_self"); } }); } })(window, jQuery); </script>