AJAX画页面

$(function(){
$('#showList').hide();
var date=new Date;
var year=date.getFullYear(); 
$('#YEAR').append( "<option value=\""+year+"\">"+year+"</option>" );
for(var i=1;i<10;i++){
//var c=Number(year)+Number(i);
var d=Number(year)-Number(i);
//$('#YEAR').append( "<option value=\""+c+"\">"+c+"</option>" );
$('#YEAR').append( "<option value=\""+d+"\">"+d+"</option>" );
}
    $('#YEAR').change(function(){
    $('.mainbg').hide();
    $('#showList').show();
    //年份改变时先将已有数据清0
    //表格行数  
    var rows = document.getElementById("tableList").rows.length;   
    //表格列数 
    var cells = document.getElementById("tableList").rows.item(0).cells.length; 
    for(var m=1;m<=rows;m++){
    for(var n=2;n<=cells;n++){
    $("#tableList").find("tr").eq(m).find("td").eq(n).html("0.0");
    }
    }
        $.ajax({
             type: "GET",
             url: "project.do?actionType=queryByYear",
             data:{
            year: this.value ,
            projectClassId:'1'
            },
             dataType: "json",
             success: function(data){
            var html='<table cellSpacing="0" id="table"  cellPadding="0"  align="center" border="0"><TBODY><tr><th width="18%" ><div align="center">总计</div></th><td  width="8%">'+data.nowCountProject+'</td>'+
            '<td width="8%">'+data.feeAuthorize+'</td><td width="8%">'+data.incomeFees+'</td></tr><tr><th  width="18%"><div align="center">去年同期</div></th><td width="8%">'+data.LastCountProject+'</td><td width="8%">'+
            data.LastYearfeeAuthorize+'</td><td width="8%">'+data.LastYearincomeFees+'</td></tr><tr><th width="18%"><div align="center">增长</div></th><td width="8%">'+data.percentageCount+'</td><td width="8%">'+data.percentageAccess+'</td><td width="8%">'+
            data.percentageIncome+'</td></tr></TBODY></table>';
            $('#show').html(html);
              $.each(data.authorizeDataMap, function(key, value){
              for(var i=1;i<10;i++){
            var id= $("#tableList").find("tr").eq(i-1).find("td").eq(0).text();
            //alert(id)
            if(id==key){
            $("#tableList").find("tr").eq(i-1).find("td").eq(2)
            .html('<a href="contract.do?actionType=init&@projectClassId=1&@checkStatusId=2&@contractType='+id+'">'+value[1]+'</a>');
            $("#tableList").find("tr").eq(i-1).find("td").eq(3).html(value[2]);
            }
              }
               }); 
              
              $.each(data.incomeDataMap, function(key, value){
              for(var i=1;i<30;i++){
            var id= $("#tableList").find("tr").eq(i-1).find("td").eq(0).text();
            if(id==key){
            $("#tableList").find("tr").eq(i-1).find("td").eq(4)
            .html('<a href="../outlay/outlay.do?actionType=init&@projectClassId=1&@checkStatusId=2&@contractType='+id+'&contract=true">'+value[1]+'</a>');
            }
              }
               }); 
           
                      }
         }); 
    });
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 要实现登录和注册页面之间的切换,可以使用JavaScript和DOM操作来动态更改页面内容。 例如,在页面上创建两个不同的`div`元素,一个是登录页面,另一个是注册页面,然后通过JavaScript中的事件监听器来捕捉用户的操作。 当用户点击“注册”按钮时,JavaScript代码将隐藏登录页面并显示注册页面,当用户点击“登录”按钮时,相反的操作将发生,即隐藏注册页面并显示登录页面。 以下是一个示例代码,假设页面中有id为"login-page"和"register-page"的两个div元素: ``` // 获取登录和注册按钮 var loginBtn = document.getElementById("login-btn"); var registerBtn = document.getElementById("register-btn"); // 获取登录和注册页面 var loginPage = document.getElementById("login-page"); var registerPage = document.getElementById("register-page"); // 监听登录和注册按钮的点击事件 loginBtn.addEventListener("click", function() { // 隐藏注册页面 registerPage.style.display = "none"; // 显示登录页面 loginPage.style.display = "block"; }); registerBtn.addEventListener("click", function() { // 隐藏登录页面 loginPage.style.display = "none"; // 显示注册页面 registerPage.style.display = "block"; }); ``` 在这个示例代码中,我们获取了登录和注册按钮以及登录和注册页面的引用。然后,我们为这些按钮添加了一个点击事件监听器,以便在单击按钮时触发相应的事件。在每个事件处理程序中,我们隐藏另一个页面并显示当前页面。最后,我们使用CSS的`display`属性来控制页面的可见性。 ### 回答2: 要使用Ajax实现登录页面和注册页面的切换,首先需要在页面上设置登录和注册两个按钮,并给它们绑定点击事件。当用户点击登录按钮时,通过Ajax发送登录页面的请求,并将返回的HTML内容替换掉页面中的内容区域。同样地,当用户点击注册按钮时,通过Ajax发送注册页面的请求,并将返回的HTML内容替换掉页面中的内容区域。 具体实现步骤如下: 1. 在HTML中设置登录和注册按钮,并为它们添加id属性,方便在JavaScript中进行选择和操作。 ```html <button id="loginBtn">登录</button> <button id="registerBtn">注册</button> <div id="contentArea"></div> ``` 2. 在JavaScript中监听按钮的点击事件,并发送Ajax请求获取页面内容。 ```javascript // 引入jQuery库 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> // 监听按钮点击事件 $(document).ready(function() { $('#loginBtn').click(function() { $.ajax({ url: 'login.html', success: function(data) { $('#contentArea').html(data); // 替换内容区域的HTML } }); }); $('#registerBtn').click(function() { $.ajax({ url: 'register.html', success: function(data) { $('#contentArea').html(data); // 替换内容区域的HTML } }); }); }); ``` 3. 创建login.html和register.html两个文件,分别编写登录和注册的HTML代码。 通过以上步骤,点击登录按钮时会发送Ajax请求获取登录页面的内容,并将其替换到内容区域;点击注册按钮时会发送Ajax请求获取注册页面的内容,并将其替换到内容区域。这样就实现了登录页面和注册页面的切换。 ### 回答3: 通过使用AJAX可以实现登录页面和注册页面的切换,以下是一种实现方式: 1. 首先,在HTML页面中创建一个容器,用来显示登录页面或注册页面的内容。 2. 创建一个JavaScript函数,用于处理页面切换事件。函数中通过AJAX请求获取登录页面或注册页面的内容。 3. 在登录页面和注册页面的内容可通过HTML代码编写,也可通过服务器端动态生成。 4. 当用户点击登录或注册按钮时,调用JavaScript函数,发送AJAX请求获取对应页面的内容。 5. 在AJAX请求的成功回调函数中,将获取到的页面内容插入到指定的容器中,从而实现页面的切换。 6. 在切换时,可以根据需要对页面进行一些动效果或其他操作。 需要注意的是,切换页面时需要处理用户输入的表单数据,以确保数据的安全性和有效性。可以通过在AJAX请求中添加参数,将表单数据传递给服务器端进行处理和验证。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值