Div下拉式菜单选择项



asp.net 做的一个下拉选择项

前台代码：

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Spyjview.ascx.cs" Inherits="hkpro.Choose.portal.Spyjview1" %>
<style>
    li{list-style-type:none;}

    a:link {
        font-size: 12px;
        color: #000000;
        text-decoration: none;
    }
    a:visited {
        font-size: 12px;
        color: #000000;
        text-decoration: none;
    }
    a:hover {
        font-size: 12px;
        color: #999999;
        text-decoration: underline;
    }
    #yjImg {
        width: 0px;
        height: 0px;
        overflow:hidden;
        border-top: 5px solid black;
        border-right: 5px solid transparent;
        border-left: 5px solid transparent;
        border-bottom: 5px solid transparent;
    }
</style>
<script src="../../easyui/jquery.min.js"></script>
<script >
    $<%=this.Spyjview%> = $(document);
    $(document).ready(function () {
        $("#div_yj").click(function (e) { e.stopPropagation(); });

        var yjL = $("#div_yj");
        $(document).click(function () {
            if (yjL.is(':visible')) {
                yjL.hide();
            }
        })

        $("#yjImg").click(function (e) {
            e.stopPropagation();
            if (!yjL.is(':visible')) {
                var x=e.clientX;
                var y=e.clientY;
                var winW = $(window).innerWidth();
                var winH = $(window).innerHeight();
                var yjlW=yjL.width();
                var yjlH=yjL.height();
                if (x + yjlW > winW) {
                    x = winW - yjlW;
                }
                if (y + yjlH > winH) {
                    y = winH - yjlH;
                }
                yjL.css("left",  x+ "px");
                yjL.css("top",  y+ "px");
                yjL.show();
            }
        })

        yjL.find("li").click(function (e) {
           // $('#<%=this.TagetId%>').val(this.innerText);

           // 点击选择项的事件
            $<%=this.Spyjview%>.trigger("onSelected", [this.innerText, function () { }]);
            yjL.hide();
        })
    })
</script>

<img src="#" id="yjImg" alt="选择系统提供的审批意见" />
<div id="div_yj" style="width:100px; height:0px; line-height:25px; position:absolute;float:initial;display:none;">
    <ul runat="server" id="yjList" style="padding:0; padding-left:25px; margin:0; text-align:left; background:#DDD;">
    </ul>
</div>

后台代码，初始化ul内部内容
            DataTable dt= SqlHelper.ExecuteDt(strSql);
            string innerHtml="";
            foreach (DataRow dr in dt.Rows)
            {
                innerHtml += string.Format("<li><a href='javascript:void'>{0}</a></li>", dr[0]);
            }

            yjList.InnerHtml = innerHtml;