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>
  • 相关阅读:
    全宁对医药行业销售代表的介绍
    effective c#读书笔记之二 静态成员的初始化
    自学笔记
    effective c#读书笔记之一
    如何判断表中是否有值
    领域驱动
    VIM 打造自己的VIM界面!
    Jqueryui的用法!
    php中io操作!
    php中Http请求!
  • 原文地址:https://www.cnblogs.com/nananana/p/8413852.html
Copyright © 2011-2022 走看看