day02-10仿搜索框及下拉列表

JunXian9102

于 2017-03-13 17:15:22 发布

阅读量262

点赞数

本文链接：https://blog.csdn.net/smiple9102/article/details/61922103

版权

js-dom基础课堂笔记专栏收录该内容

26 篇文章 0 订阅

订阅专栏

仿搜索框
业务逻辑：文本框获取焦点后如果用户输入的值是金融默认文字要清除。如果用户输入的值为空，文本框失去焦点后默认文字要加上

var txt=document.getElementById('txt');
    txt.onfocus=function  () {
        if (this.value==="金融";) {
            this.value="";
        };  
    }
    txt.onblur=function  () {
        if (this.value==="";) {
            this.value="金融";
        }   
    }；
    </script>

下拉列表select 点击选中选项 selected=true;

<body>
<select >
    <option value="">A</option>
    <option value="">C</option>
    <option value="" id="d">D</option>
</select>
<input type="button" value="按钮" id="btn" />

    <script>
    btn.onclick=function  () {
        d.selected=true;
    }
    </script>

全选反选

<script>
        //找人
        var all=document.getElementById('j_cbAll');
        var tb=document.getElementById('j_tb');
        var checkboxes=tb.getElementsByTagName('input');
        //选中属性checked
        //上面的控制下面的
         all.onclick=function () {
            for (var i = 0 ; i<=checkboxes .length; i++) {
                checkboxes[i].checked=all.checked;
            };
         }
         //下面的控制上面的
         for (var i = 0 ; i<=checkboxes .length; i++) {
                checkboxes[i].onclick=function  () {
                    //判断有木有选中
                    var isCheckedeAll=true;//假设都选中
                     for (var i = 0 ; i<=checkboxes .length; i++)  {
                    if (checkboxes[i].checked!==true) {//当前这个没选中
                        isCheckedeAll=false;
                        break;
                    };
                };
                all.checked=isCheckedeAll;
                    /*if (isCheckedeAll===true) {
                        all.checked=true;
                    };
                    if (isCheckedeAll===false) {
                        all.checked=false;
                    };*/

                }
            };
    </script>