jQuery+Asp.Netは簡単なドロップダウンロードを実現

5274 ワード

元のショッピングモールプロジェクトは今、ドロップダウンロードの機能を追加する必要があります.簡単に実現しました.考えとコードを整理することができます.
ドロップダウンロードが必要な内容をJSON処理に移行して現在のページが存在します.
<script type="text/javascript">var objson = eval([{"Id":"5991","product_name":"                 ","order_by":"98569","is_show":"True","price":"428","sale_price":"399","Images":"saxjua16.jpg"},{"Id":"5990","product_name":"                   ","order_by":"98568","is_show":"True","price":"429","sale_price":"399","Images":"d2yjivhl.jpg"},....    ]</script>

次はjavascriptコードのことです
<script type="text/javascript">

        $(document).ready(function () {

            var totalheight = 0;

            function loadData() {

                totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());

                if ($(document).height() <= totalheight) {

                    GetProducts();//    

                }

            }

            $(document).scroll(function () {

                loadData();

            });



            function GetProducts() {

                var htmlSource;

                var iIndex = 6; //        

                var icount = parseInt($("#hidJsonCount").val()); //        for   

                var obj = objson;

                if (obj.length - icount < 6) {

                    iIndex = obj.length - icount;

                }

                if (icount < obj.length) {

                    for (var i = icount; i < (icount+iIndex); i++) {

                        var val = obj[i];

                        htmlSource += '<div class="deal">';

                        htmlSource += '<a href="p_show.aspx?productId=' + val.Id + '" target="_blank">';

                        htmlSource += '<img src="http://www.baidu.com/upload-file/images/product/' + val.Images + '" alt="" border="0" title="' + val.product_name + '"></a>';

                        htmlSource += '<h3>';

                        htmlSource += '<a href="p_show.aspx?productId=' + val.Id + '" title="' + val.product_name + '" target="_blank">' + val.product_name + '</a>';

                        htmlSource += '</h3>';

                        htmlSource += '<h4>';

                        htmlSource += '<em><b>¥</b>' + val.sale_price + '</em><a href="p_show.aspx?productId=' + val.Id + '" target="_blank">  </a>';

                        htmlSource += '</h4>';

                        htmlSource += '<span class="newicon"></span>';

                        htmlSource += '</div>';

                    }

                    $("#hidJsonCount").val((icount + iIndex).toString());

                }

                $("#moreProduct").append(htmlSource);

            }

        });

    </script>
$("#hidJsonCount").val();     input hidden                   。