请哪位大神帮我改下这段代码.

Question

我要执行的效果是:鼠标移到小图上,图片放大.
一,以下为Jquery代码
    <script type="text/javascript">
        //<![CDATA[
        $(function () {
            var x = 10;
            var y = 20;
            $("a.tooltip").mouseover(function (e) {
                this.myTitle = this.title;
                this.title = "";
                var imgTitle = this.myTitle ? "<br/>" + this.myTitle : "";
                var tooltip = "<div id='tooltip'><img src='" + this.href + "' alt='预览图'/>" + imgTitle + "<\/div>"; //创建 div 元素
                $("body").append(tooltip); //把它追加到文档中  
                $("#tooltip")
                    .css({
                        "top": (e.pageY + y) + "px",
                        "left": (e.pageX + x) + "px"
                    }).show("fast");   //设置x坐标和y坐标，并且显示
            }).mouseout(function () {
                this.title = this.myTitle;
                $("#tooltip").remove();  //移除 
            }).mousemove(function (e) {
                $("#tooltip")
                    .css({
                        "top": (e.pageY + y) + "px",
                        "left": (e.pageX + x) + "px"
                    });
            });
        })
        //]]>
</script>
二,以下为页面调用代码
<a href="image/OK.jpg" class="tooltip" title="放大"><img src="image/OK.jpg" width="150" alt="放大" /></a>
三,以下为CSS代码
    <style type="text/css">#tooltip{
position:absolute;
border:1px solid #333;
background:#f7f5d1;
padding:3px 3px 3px 3px;
color:#333;
display:none;
}
</style>
四,以下为我的Gridview
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CssClass="header_b2" DataKeyNames="Number" CellPadding="3" OnRowDataBound="GridView1_RowDataBound" HorizontalAlign="Center">
                            <Columns>
                                <asp:TemplateField HeaderText="编号">
                                    <ItemTemplate>
                                        <asp:Label ID="Label1" runat="server" Text='<%# Container.DataItemIndex+1 %>'></asp:Label>
                                    </ItemTemplate>
                                    <FooterStyle CssClass="footerborder" />
                                    <HeaderStyle CssClass="border-right" Width="30px" Height="30px" />
                                </asp:TemplateField>
                                <asp:TemplateField HeaderText="图片">
                                    <ItemTemplate>
                                         <a id="aaat" href="<%# "../Handler3.ashx?Imid="+ Eval("Number") %>" title=""><img id="imgkku" src="<%# "../Handler3.ashx?Imid="+ Eval("Number") %>" width="25" alt="" /></a>
                                    </ItemTemplate>
                                    <FooterStyle CssClass="footerborder" />
                                    <HeaderStyle CssClass="border-right" Width="30px" />
                                </asp:TemplateField>                            </Columns>
                        </asp:GridView>
五,直接用<a href="image/OK.jpg" class="tooltip" title="放大"><img src="image/OK.jpg" width="150" alt="放大" /></a>这段代码,在页面测试是没有问题的,但我现在要将此方法用到Gridview上面,于是我将此段代码改为<a href="<%# "../Handler3.ashx?Imid="+ Eval("Number") %> " class="tooltip" title="放大"><img src="<%# "../Handler3.ashx?Imid="+ Eval("Number") %> " width="150" alt="放大" /></a>,就没有效果了,可能是路径我没搞对,请哪位朋友帮我改下.多谢!

Answer 1

看你四里面的a标签是没有添加class名字的。看你五里面又有class名字了，排除了这些那也就是你服务器端代码生成到客户端的时候出错了，导致路径不对。<a href="../Handler3.ashx?Imid=<%# Number%>" class="tooltip" title="放大"><img src="../Handler3.ashx?Imid=<%# Number%>" width="150" alt="放大" /></a>改成这样试试，这里你只用到Number，干嘛把./Handler3.ashx?ImgId=都放到<%# %>里面去呢

Answer 2

"../Handler3.ashx?Imid=<%# Number%>"这么写报错.