zoukankan      html  css  js  c++  java
  • select下拉框之默认选项清空

    最近和小伙伴发现,select默认选项一般是提示信息,怎么才能让当我们点击下拉框时,可选的选项中没有默认的提示信息呢?

    思路:

    1.当点击下拉框时,让默认提示信息,即下拉框第一个选项移除。

    2.当没有选中下拉框的信息时,让默认提示信息添加到下拉框的第一个选项上。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>标准select下拉框</title>
    </head>
    <body>
    <select id="skill" onfocus="choose()" onblur="turnoff()">
        <option value="请选择">请选择</option>
        <option value="java">java</option>
        <option value="javaScript">javaScript</option>
        <option value="vue">vue</option>
        <option value="bootStrap">bootStrap</option>
        <option value="springMvc">springMvc</option>
    </select>
    </body>
    <script src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
    $(function () {
        $("#skill").val("请选择");
    })
    /**
     * 得到焦点事件
     */
    function choose() {
        if($("#skill").val() == "请选择"){
            $("#skill option:eq(0)").remove();
            $("#skill").val("");
        }
    }
    /**
     * 失去焦点事件
     */
    function turnoff() {
        if($("#skill").val() == null || $("#skill").val() == ""){
            $("#skill").prepend("<option value='请选择' selected='selected'>请选择</option>");
        }
    }
    </script>
    </html>
  • 相关阅读:
    mysql这个垃圾迁移数据费劲半天
    https请求,可设置请求格式
    mybatis plus 使用
    https请求,get post 通用
    根据经纬度,查询最近距离
    redis与mysql一致性
    导入excel
    在idea中git怎么使用
    spring的传播机制
    通过RequestContextHolder获取HttpServletRequest
  • 原文地址:https://www.cnblogs.com/nananana/p/8413852.html
Copyright © 2011-2022 走看看