• 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...

       

  • 相关阅读:
    Linux配置Nginx负载均衡
    linux虚拟机ping不通主机和外网(包括刚装系统遇到的一些问题)
    MySQL的主从复制
    ubuntu下安装php
    ubuntu下sudo apt-get update Sources 404 Not Found 解决方法
    java 中类的加载顺序
    PHP生成各种验证码和Ajax验证
    PHP算法之二分查找和顺序查找
    ThinkPHP中SQL调试方法
    mysql 处理中文乱码问题
  • 原文地址:https://www.cnblogs.com/thinkingandworkinghard/p/7428723.html
Copyright © 2020-2023  润新知