100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > select下拉框默认不能选择第一个选项的问题

select下拉框默认不能选择第一个选项的问题

时间:2023-12-16 21:01:19

相关推荐

select下拉框默认不能选择第一个选项的问题

如题,现在有个js的功能:用户选择下拉框的同时,把选择的下拉框显示出来。同时选择的不能有重复的。刚开始 使用的是 select的onchange事件:

1 $("#liveType").on("change",function(){2$("#selectedLiveType").append("<p><span class='close'>X</span><button value='"+$('#liveType option:selected').val()+"' name='selectLiveType' οnclick='removeLiveType(this)' style='background-color:white'>"+$('#liveType option:selected').text()+"</button></p>")3 4 })

然而这种情况下,当选择第一个的时候 ,总是没有任何的反应。于是google:得到下面的方法

Element.prototype.onSelectChange = function(callback) {var cached = 0;this.addEventListener("click", function(event) {if (cached == this) {callback.call(this, event);cached = 0;} else {cached = this;}});}var select = document.getElementById("liveType");select.onSelectChange(function(event) {var liveTypes=new Array();$("button[name='selectLiveType']").each(function () {liveTypes.push($(this).val());})var checkArray = liveTypes.join(',');if(checkArray.indexOf($('#liveType option:selected').val()) == -1){$("#selectedLiveType").append("<p><span class='close'>X</span><button value='"+$('#liveType option:selected').val()+"' name='selectLiveType' οnclick='removeLiveType(this)' style='background-color:white'>"+$('#liveType option:selected').text()+"</button></p>")}});

通过 定义一个 数组checkArray, 使用indexOf进行判断有没有重复的。ok...

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。