程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> 更多編程語言 >> 編程綜合問答 >> ajax-點擊詳細信息,彈出一個層顯示所有的信息,信息是從後台獲取的

ajax-點擊詳細信息,彈出一個層顯示所有的信息,信息是從後台獲取的

編輯:編程綜合問答
點擊詳細信息,彈出一個層顯示所有的信息,信息是從後台獲取的

頁面是html,數據是用ajax調用Servlet獲取的。

信息是分兩部分,第一部分是會員信息,第二部分是會員報名的信息,在一個層上顯示。

最佳回答:


jquery load下內容到你的曾就好。。

DEMO,你的jsp只返回需要的html代碼,不要連html,body標簽那種一起返回了,要不可能頁面會錯亂

 <table id="tbUser">
<tr><td><a href="read.jsp?id=你的數據id" ajax="1">報名信息</a></td></tr>
.....其他的數據行
</table>
<style>
#layer{position:absolute;border:solid 1px #000;width:300px;height:200px;display:none;top:50%;left:50%;margin-left:-150px;margin-top:-100px}
</style>
<div id="layer"></div>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
    $(function () {
        $('#tbUser a[ajax]').click(function () {
            $('#layer').load(this.href, function () { $('#layer').show(); });
            return false;
        })
    });
    $(document).click(function (e) {
        if (e.target.id != 'layer' && !$.contains($('#layer')[0], e.target)) $('#layer').hide();
    });
</script>
  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved