• 个人作业2 前端3


    1、查询界面

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>多条件查询</title>
    <link rel="stylesheet" href="css/search.css" type="text/css">
    <link type="text/css" href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/jquery-1.11.3.min.js"></script>
    <script src="js/echarts.js"></script>
    <script src='js/worldcloud.js'></script>
    <script src="js/bootstrap.js"></script>
    <style type="text/css">
    body{
    background:url("./backs.jpg");
    background-repeat:repeat;
    background-size:1600px 800px;
    background-position-center:100%;
    }
    </style>
    <script type="text/javascript">
    function dele(p){
    var condition=document.getElementById('query');
    var qution=document.getElementById('in_text');
    var htmltext="<table class='table table-striped' style='text-align:center'><caption style='text-align:center'>相关论文题目与链接</caption>";
    $.post(
    'ConditionServlet',
    {
    'condition':condition.value,
    'qution':qution.value
    },
    function(result)
    {
    json=JSON.parse(result);
    for(i=0;i<json.length;i++)
    {
    if(i==p)continue;
    htmltext+="<tr><td><a target='_blank' href='"+json[i].link+"'>"+json[i].title+"</a></td><td><a href='javascript:void(0);' onclick='dele("+i+")'>删除</a></td></tr>";
    }
    htmltext+="</table>";
    $("#show").html(htmltext);
    }
    )
    }
    function moreQuery(){
    var condition=document.getElementById('query');
    var qution=document.getElementById('in_text');
    var htmltext="<table class='table table-striped' style='text-align:center'><caption style='text-align:center'>相关论文题目与链接</caption>";
    $.post(
    'ConditionServlet',
    {
    'condition':condition.value,
    'qution':qution.value
    },
    function(result)
    {
    json=JSON.parse(result);
    for(i=0;i<json.length;i++)
    {
    htmltext+="<tr><td><a target='_blank' href='"+json[i].link+"'>"+json[i].title+"</a></td><td><a href='javascript:void(0);' onclick='dele("+i+")'>删除</a></td></tr>";
    }
    htmltext+="</table>";
    $("#show").html(htmltext);
    }
    )
    }
    window.onload=function(){
    var up=document.getElementById('up');
    up.onclick=moreQuery;
    }
    </script>
    </head>
    <body>
    <div>
    <form class="search_form" action="" method="post">
    <input type="button" value="题目" readonly="readonly" class="query">
    <input type="text" class="input_text" placeholder="请输入搜索内容" id="in_text">
    <br>
    <select class="query" id="query">
    <option value ="title">题目</option>
    <option value ="authors">作者</option>
    <option value ="keyword">关键字</option>
    </select>
    <input type="text" class="input_text" placeholder="请输入搜索内容" id="in_text">

    <input type="button" value="搜索 " class="input_sub" id="up">
    </form>
    <form class="form" id="entry_form">
    <input type="submit" value="热词统计" formaction="show.html" class="query" id="up">
    </form>
    <script type="text/javascript">
    $(function(){
    $("#entry_name").focus();
    $(document).keydown(function(event){
    if(event.keyCode==13){
    $("#entry_btn").click();
    }
    });
    });
    </script>
    </div>
    <div id="show">
    </div>
    </body>
    </html>

  • 相关阅读:
    iOS 关于字体根据不同屏幕尺寸等比适配的问题(zz)
    安卓开发:一种快速提取安卓app的UI图标资源的方法
    申请邓白氏编码的时候总是提示 Enter a valid Street Address 怎么办?
    利用日期、经纬度求日出日落时间 C语言程序代码(zz)
    JS导出Excel 代码笔记
    Bootstrap系列 -- 44. 分页导航
    Bootstrap系列 -- 43. 固定导航条
    Bootstrap系列 -- 42. 导航条中的按钮、文本和链接
    Bootstrap系列 -- 41. 带表单的导航条
    Bootstrap系列 -- 40. 导航条二级菜单
  • 原文地址:https://www.cnblogs.com/lx06/p/14907800.html
Copyright © 2020-2023  润新知