zoukankan      html  css  js  c++  java
  • 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'  onclick='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'  onclick='removeLiveType(this)'  style='background-color:white'>"+$('#liveType option:selected').text()+"</button></p>")
    	}
    
    });
    

      

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

       

  • 相关阅读:
    【Ebola】python day4
    源代码管理SVN的使用
    源代码管理git的使用
    UIViewController的生命周期及iOS程序执行顺序
    iOS
    Quartz2D知识点聚合案例
    iOS之NSAttributedString-------字符属性
    iOS-控件响应用户控制事件之事件处理
    UINavigationController
    程序启动的完整过程
  • 原文地址:https://www.cnblogs.com/thinkingandworkinghard/p/7428723.html
Copyright © 2011-2022 走看看