zoukankan      html  css  js  c++  java
  • 大二下学期第二次个人作业第一阶段

    今日对查询的前端界面进行了一些优化,由于ICCV只有2019,ECVA只有2020与2018年,所以年份与来源的下拉框进行了一下联动。

    之前的查询出来的数据没有序号很不方便,现加上了序号,之前的每行把题目,作者都显示出来了,导致有的行过宽,现将过长的省略显示。

    对用户输入的内容进行检测,防止输入特殊字符

     var btn=document.getElementById("submit");
        btn.onclick=function () {
            flag=0;
            var pattern = new RegExp("[`~!@#$^&*()=|{}':;',\[\].<>/?~!@#¥……&*()——|{}【】‘;:”“'。,、?%]");
            var title = document.getElementById("title").value;
            var author = document.getElementById("author").value;
            var mainworld = document.getElementById("mainworld").value;
            var year = $(".year").find("option:selected").text();
            var meet = $(".meet").find("option:selected").text();
            if(title.match(pattern)){
                flag=1;
            }
            if(author.match(pattern)){
                flag=1;
            }
            if(mainworld.match(pattern)){
                flag=1;
            }
            if(flag==0){
                $.ajax({
                    url: "/query",
                    data: {
                        title: title, author: author, mainworld: mainworld,
                        year: year, meet: meet
                    },
                    success: function (data) {
                        $(".tablebox tbody").empty();
                        for (var i = 0; i < data.data.length; i++) {
                            var Day = data.data[i][0].split(' ')
                            str=i+1+""
                            appendHtmlBody = "<tr><td>" +
                                str+"</td><td>" +
                                "<a href='"+data.data[i][4]+"' target='view_window'>"+leave_out(data.data[i][0]) + "</a></td><td>" +
                                leave_out(data.data[i][1]) + "</td><td>" +
                                data.data[i][2] + "</td><td>" +
                                data.data[i][3] + "</td><td>" +
                                leave_out(data.data[i][5]) + "</td></tr>"
                            $(".tablebox tbody").append(appendHtmlBody);
                        }
                    },
                    error: function (xhr, type, errorThrown) {
                    }
                })
            }else{
                alert("有特殊字符,请重新输入!")
            }
        }
        {#下拉框联动#}
        $("#meet").on("change",function(){
            var flag=$("#meet").find("option:selected").text();
            if(flag=="CVPR"){
                $("#year").empty()
                str="<option value='2020'>2020</option>"+
                    "<option value='2019'>2019</option>"+
                    "<option value='2018'>2018</option>"+
                    "<option value='ALL'>ALL</option>"
                $("#year").append(str)
            }
            if(flag=="ICCV"){
                $("#year").empty()
                str="<option value='2019'>2019</option>"
                $("#year").append(str)
            }
            if(flag=="ECVA"){
                $("#year").empty()
                str="<option value='2020'>2020</option>"+
                    "<option value='2018'>2018</option>"+
                    "<option value='ALL'>ALL</option>"
                $("#year").append(str)
            }
            if(flag=="ALL"){
                $("#year").empty()
                str="<option value='2020'>2020</option>"+
                    "<option value='2018'>2019</option>"+
                    "<option value='2018'>2018</option>"+
                    "<option value='ALL'>ALL</option>"
                $("#year").append(str)
            }
        })
    
        function leave_out(str){
            if(str.length>=30)
            {
                str=str.substring(0,30)+"..."
            }
            return str
        }

  • 相关阅读:
    hash join外连接可以指定驱动表
    hash join 内连接可以指定驱动表
    R 语言命令行参数处理
    仿悦跑圈轨迹回放
    仿悦跑圈轨迹回放
    仿悦跑圈轨迹回放
    仿悦跑圈轨迹回放
    Android FrameWork学习(二)Android系统源码调试
    Android FrameWork学习(二)Android系统源码调试
    Android FrameWork学习(二)Android系统源码调试
  • 原文地址:https://www.cnblogs.com/fengchuiguobanxia/p/14730502.html
Copyright © 2011-2022 走看看