zoukankan      html  css  js  c++  java
  • html和jquery交互

    
    1.
    20.5.101.31_/root>cat displayesblog.html 
    <html>
    <head>
        <title>运维平台</title>
        <link rel="stylesheet" type="text/css" href="/static/Css/Monitor/displayesblog.css">
        <link rel="stylesheet" type="text/css" href="/static/Css/Public/header.css">
        <link rel="stylesheet" type="text/css" href="/static/Css/Public/menu.css">
    </head>
    <body>
        <include file="Public:header"/>
        <div class="content">
            <include file="Public:menu"/>
            <div class="con fl">
                <label class="condition">应用环境</label>
                <select name="env" class="monitor">
                <option value="esb">ESB系统</option>
                <option value="test">TEST系统</option>            
                </select>
                
                <label class="condition">日志选型IN/OUT日志</label>
                <select name="esbtag" class="monitor">
                <option value="in">IN端日志</option>
                <option value="out">OUT端日志</option>    
                </select>
                
                <label class="condition">全局流水号</label><input type="text" name="esbserviceflowno" class="monitor01">
                
                <!--<input type="submit" value="download" class="monitor_add">-->
                <input type="submit" value="download" class="download_add">
                <!--<input type="submit" value="get_mq_message" class="monitor_start">-->
                <input type="submit" value="sendmail" class="sendmail_add">
                
            </div>
            <table class="gridtable fr">
                    <tr><th>消息</th></tr>
            </table>
        </div>
    </body>
    <script type="text/javascript" src="/static/Js/jquery-2.2.2.min.js"></script>
    <script type="text/javascript" src="/static/Js/Monitor/displayesblog.js"></script>
    <!script type="text/javascript" src="/static/Js/Public/menu.js"><!/script>
    <script type="text/javascript" src="/static/Js/Public/ajax.js"></script>
    </html>
    
    
    2.
    
    $(function(){
        var _env_select = $("select[name='env']");
        var _esbtag_select = $("select[name='esbtag']");
        var _esbserviceflowno_select= $("input[name='esbserviceflowno']");
        var _sub_btn = $(".download_add");
        _sub_btn.on("click",function(){
        console.log(_env_select.val())
        console.log(_esbtag_select.val())
        console.log(_esbserviceflowno_select.val())
           _sub_btn.attr('disabled','disabled'); 
                    var data={};
            data.env=_env_select.val()
            data.esbtag=_esbtag_select.val()
            data.esbserviceflowno=_esbserviceflowno_select.val()
                    var successfn = function(jdata){
                    _sub_btn.removeAttr('disabled');
                    $(".gridtable").empty();
                    var _HTML="<tr><td>下载信息</td></tr>";
                   console.log('aaaaaaaaaaaaaaaaaaaa');
                   console.log(jdata);
                   console.log('aaaaaaaaaaaaaaaaaaaa');
                   for(var L1=0;L1<jdata.length;L1++){
                    _HTML =_HTML +'<tr><td>'+ jdata[L1]+'</td></tr>'
                        };
                    $(".gridtable").html(_HTML); 
                    };
                    var errorfn = function(){
                    _sub_btn.removeAttr('disabled');
                    alert("数据获取出错");
                    };
                    $.ajax({
                    type: "post",
                    data: data,
                    url: "/api/downloadesbfile/",
                    dataType: "json",
                    success: function(d){
                        successfn(d);
                    },
                    error: function(e){
                        errorfn(e);
                    }
                });
            }
        );
    });
  • 相关阅读:
    Windows系统安装mysql5.7*时mysql服务启动失败的解决方法
    安装MySQL出现 This application requires Visual Studio 2013 x64 Redistributable.Please install the Redistributable then run this installer again
    Fiddler抓包流程
    C#使用NPOI根据模板生成Word文件功能实现
    .NET nhibernate 添加新的表运行报is not mapped的问题
    二进制原码、反码、补码和位运算
    【英语】面试常用语整理
    【检测分割算法整理】
    【Leetcode方法比较】DP/滑窗/前缀和
    【Leetcode】数学系列
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13349091.html
Copyright © 2011-2022 走看看