louiset 2017-09-30 06:29 采纳率: 57.1%
浏览 915
已结题

请问一下,这个js程序的search函数部分哪里出错了? 谢谢!

 <!DOCTYPE html>
<html>
<head>
    <title>百度前端技术学院jstask8</title>
    <style type="text/css">
        div{
            display: inline-flex;
            flex-wrap: wrap;
            border: 1px solid black;
            padding: 20px;
            margin:10px; 
            background-color: white;
        }

    </style>
</head>
<body>
  <div id="all">everything
    <div class="items" id="book">books
        <div class="book">book1</div>
        <div class="book">book2</div>
        <div class="book">book3</div>
    </div>
    <div class="items" id="song">songs
        <div class="song">song1</div>
        <div class="song">song2</div>
        <div class="song">song3</div>
    </div>
    <div class="items" id="drink">drinks
        <div class="drink">drink1</div>
        <div class="drink">drink2</div>
        <div class="drink">drink3</div>
    </div>
  </div></br>
  <input type="button" name="order" value="order">
  <input type="text" name="search">
  <input type="button" name="search" value="search">
  <script type="text/javascript">
    var everything = document.getElementsByClassName("all");
    var items = document.getElementsByClassName("items");
    var list = [];
    var button = document.getElementsByTagName("input")[0];
    var timer;
    var searchb = document.getElementsByTagName("input")[2];

    button.onclick = function (){
        reset();
        preOrder();
        change();
    }
    searchb.onclick = function(){
        reset();
        preOrder();
        search();
    }

    function preOrder(){
        list.push(all);
        for (var i = 0; i < items.length; i++) {
             list.push(items[i]);
             var item = items[i].children
             for (var j = 0; j < item.length; j++) {
                list.push(item[j]);
             }
        }
    }

    function change(){
        var i = 0;
        list[i].style.backgroundColor = "grey";
        console.log(list.length);

       timer = setInterval(
         function (){
            if (i<list.length-1) {
            i++;
            list[i-1].style.backgroundColor = "white";
            list[i].style.backgroundColor = "grey";
            console.log(list[i]);
            console.log(i);

         }else{
            list[i].style.backgroundColor = "white";
            clearTimeout(timer);
         }
     },700);
    }

    function reset(){
        list = [];
        clearTimeout(timer);
        var divs = document.getElementsByTagName("div");
        console.log(divs);
        for (var i = 0; i < divs.length; i++) {
            divs[i].style.backgroundColor = "white";
        }

    }

    function search(){
        var i = 0;
        list[i].style.backgroundColor = "grey";
        var input = document.getElementsByTagName("input")[1].value;
        var re = new RegExp("^"+input,"g");
        console.log(re);

       timer = setInterval(
         function (){
            if (i<list.length-1 && !re.test(list[i].innerHTML)) {
            i++;
            list[i-1].style.backgroundColor = "white";
            list[i].style.backgroundColor = "grey";

         }
         else if(re.test(list[i].innerHTML)){
            list[i].style.backgroundColor = "blue";
            alert("find it!");
            clearTimeout(timer);
         }
         else if(i == list.length-1){
            list[i].style.backgroundColor = "white";
            alert("cant find it .")
            clearTimeout(timer);
         }
                else{
                 console.log(re.test(list[i].innerHTML));
                 clearTimeout(timer);
                }
     },700);
    }

  </script>
</body>
</html>

请问这个js程序的search()函数中的第一个elseif语句,在满足条件的情况下,为什么无法执行? 谢谢!

  • 写回答

7条回答 默认 最新

  • 划过风的记忆 2017-09-30 07:13
    关注

    你的排版太惊艳啦,放在代码块里展示呀,不然显示的太可怕了

    评论

报告相同问题?

悬赏问题

  • ¥15 keil的map文件中Image component sizes各项意思
  • ¥30 BC260Y用MQTT向阿里云发布主题消息一直错误
  • ¥20 求个正点原子stm32f407开发版的贪吃蛇游戏
  • ¥15 划分vlan后,链路不通了?
  • ¥20 求各位懂行的人,注册表能不能看到usb使用得具体信息,干了什么,传输了什么数据
  • ¥15 Vue3 大型图片数据拖动排序
  • ¥15 Centos / PETGEM
  • ¥15 划分vlan后不通了
  • ¥20 用雷电模拟器安装百达屋apk一直闪退
  • ¥15 算能科技20240506咨询(拒绝大模型回答)