.Net源码论坛 [ 繁体中文 ]

发新话题 回复该主题

jquery+ajax 读取数据显示列表 [复制链接]

楼主
当读取多个不同选项的菜单列表数据时,我们可用 jquery里面的ajax 做异步显示数据,数据查询方法用 .ashx 页面封装。
即减轻了页面大量的html代码和数据加载的负担,也大大增加了友好性。。
具体示例可 参见:http://www.hnxhdh.com/downinfo.aspx
以下是jquery实现的一段代码:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
function getDownInfo(obj, num, count, obj1, num1, _type, _subject, _version) {
        var content_id = "#" + obj + obj1 + num1;
        
        var more = "#" + _type.toLowerCase() + "_more";
        if (_type == "PPT") {
            $(more).attr({ "href": "downList.aspx?tId=" + _version + "&sId=" + _subject + "&Action=PPT" });
        } else if (_type == "Prepara") {
            $(more).attr({ "href": "downList.aspx?PTypeId=" + _version + "&PSubject=" + _subject + "&Action=Prepara" });
        } else if (_type == "Epaper") {
            $(more).attr({ "href": "downList.aspx?EGrade=" + _version + "&ESubjectId=" + _subject + "&Action=Epaper" });
        }
        
        
        var loading_html = "<li>正在获取数据,请稍候...</li>";
        $(content_id).html(loading_html);
        
        $.get("/ajax.ashx", { action: 'get_down_info', type: _type, subject: _subject, version: _version }, function(json) {
            
            if (json == "null") { $(content_id).html("该分类下暂无数据."); return; }
            var return_data = eval(json);
            var str_html = "";
            for (var i = 0; i < return_data.length; i++) {
                str_html += "<li><a href='downDetails.aspx?PId=" + return_data.id + "&Action=" + _type + "'>" + return_data.title + "</a></li>";
            }
            $(content_id).html(str_html);
        });
    }
    function getSVId(_type) {
        var s = "#" + _type + " .ban_t_01";
        var subjectId = $(s).attr("title");
        return subjectId;
    }
    function getVersion(_type) {
        var s = "#" + _type + " .ban_t_01";
        var id = $(s).attr("id");
        var index = id.indexOf("v") + 1;
        return id.substring(index,id.length);
    }
</script>
分享 转发
TOP
沙发

不错
TOP
板凳

相当好
TOP
地板

值得学习以下!
TOP
五楼

还算不错了。好东西啊!
TOP
六楼

好东西啊,谢谢分享
TOP
七楼

好东西啊,谢谢分享
TOP
八楼

能不能附带注释
TOP
九楼

好东西
TOP
十楼

不错,支持一 下
TOP
发新话题 回复该主题