请看下面我的例子。如何添加单击或更改侦听器,以提醒更改/单击的选项的值(例如)。
$(function() {
$('.chkveg').multiselect({
includeSelectAllOption: true,
enableHTML: true,
optionLabel: function(element) {
return '<img src="https://placekitten.com/'+ $(element).attr('data-img')+'"> '+ $(element).text();
},
});
$(".chkveg option").change(function() {
alert($(this).val());
});
$('#btnget').click(function() {
alert($('#chkveg').val());
});
});
.multiselect-container>li>a>label {
padding: 4px 20px 3px 20px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="http://davidstutz.de/bootstrap-multiselect/docs/js/bootstrap-3.3.2.min.js"></script>
<link href="http://davidstutz.de/bootstrap-multiselect/docs/css/bootstrap-3.3.2.min.css" rel="stylesheet"/>
<link href="http://davidstutz.de/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" rel="stylesheet"/>
<script src="http://davidstutz.de/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<form id="form1">
<div style="padding:20px">
<select class="chkveg" multiple>
<option value="cheese" data-img="100/109">AAA</option>
<option value="tomatoes" data-img="100/108">BBB</option>
<option value="mozarella" data-img="100/107">CCC</option>
<option value="mushrooms" data-img="100/106">DDD</option>
<option value="pepperoni" data-img="100/105">EEE</option>
<option value="onions" data-img="100/110">FFF</option>
</select>
<select class="chkveg" multiple>
<option value="cheese2" data-img="100/109">AAA2</option>
<option value="tomatoes2" data-img="100/108">BBB2</option>
<option value="mozarella2" data-img="100/107">CCC2</option>
<option value="mushrooms2" data-img="100/106">DDD2</option>
<option value="pepperoni2" data-img="100/105">EEE2</option>
<option value="onions2" data-img="100/110">FFF2</option>
</select>
<br /><br />
<input type="button" id="btnget" value="Get Selected Values" />
</div>
</form>
例如如果我选择AAA,则应提醒“奶酪”,如果我随后选择BBB,则应提醒“西红柿”
您可以执行类似的操作来处理点击/更改
$(":checkbox").click((e)=>{
console.log("value ",e.target.value);
console.log("checked ",e.target.checked)
})
请用$(".chkveg option").change(function() {
更改$(".chkveg").change(function() {
[JSFiddle:https://jsfiddle.net/w5ts1qc3/
哦,最后但并非最不重要:我已经将https
添加到davidstutz.de资产中>