zoukankan      html  css  js  c++  java
  • 如何设置select下拉禁止选择

    如何设置select下拉禁止选择


    1、问题背景

         设置select下拉框不能选择,利用disabled="disabled",但是颜色且显示白色,容易引起用户误解


    2、问题实现

    (1)只禁止

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>如何设置select下拉禁止选择</title>
    		<script src="../js/jquery-1.12.4.js"></script>
    		<script>
    			$(function(){
    				
    			});
    		</script>
    	</head>
    	<body>
    		<select id="sel" style=" 200px; " disabled="disabled">
    			<option value="1">项目经理</option>
    			<option value="2">总经理</option>
    			<option value="3">技术经理</option>
    			<option value="4">部门经理</option>
    		</select>
    	</body>
    </html>
    

    (2)禁止且颜色为灰色

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="UTF-8">
    		<title>如何设置select下拉禁止选择</title>
    		<script src="../js/jquery-1.12.4.js"></script>
    		<script>
    			$(function(){
    				
    			});
    		</script>
    	</head>
    	<body>
    		<select id="sel" style=" 200px; background-color: #EEEEEE;" disabled="disabled">
    			<option value="1">项目经理</option>
    			<option value="2">总经理</option>
    			<option value="3">技术经理</option>
    			<option value="4">部门经理</option>
    		</select>
    	</body>
    </html>

    3、问题说明

         利用disabled="disabled"和background-color进行对select下拉框设置,这样才显示被禁止操作

              

  • 相关阅读:
    LCS 最长公共子序列
    零和数组
    Learn2Rank
    ac自动机
    208. Implement Trie (Prefix Tree)
    php截取中文字符串 GB2312 utf-8
    纵向文字滚动代码,带上下图片控制的。鼠标放到上下图片上时滚动
    js图片切换 带左右控制的
    实时显示输入的内容
    Lightbox JS v2.0图片切换效果
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13314088.html
Copyright © 2011-2022 走看看