Question

这里我在jquery中调用web方法... 如果我在普通的aspx页面中运行此代码，那么webmethod会被触发..但是当我使用母版页并将此代码放在子页面（Default4.aspx）中时，Web方法不会被触发。我使用了colorbox jquery插件。这里当我点击任何链接时，弹出窗口将打开并显示文件内容我的代码如下......

Default4.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link rel="stylesheet" href="example1/colorbox.css" type="text/css" />

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>

    <script src="jquery.colorbox.js" type="text/javascript"></script>

    <script type="text/javascript">
            $(document).ready(function(){

                //Examples of how to assign the ColorBox event to elements
                $(".group1").colorbox({rel:'group1'});
                $(".group2").colorbox({rel:'group2', transition:"fade"});
                $(".group3").colorbox({rel:'group3', transition:"none", width:"75%", height:"75%"});
                $(".group4").colorbox({rel:'group4', slideshow:true});
                $(".ajax").colorbox();
                $(".youtube").colorbox({iframe:true, innerWidth:425, innerHeight:344});
                $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409});

                $(".inline").colorbox({inline:true, width:"50%"});
                $(".callbacks").colorbox({
                    onOpen:function(){ alert('onOpen: colorbox is about to open'); },
                    onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); },
                    onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); },
                    onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); },
                    onClosed:function(){ alert('onClosed: colorbox has completely closed'); }
                });

                $('.non-retina').colorbox({rel:'group5', transition:'none'})
                $('.retina').colorbox({rel:'group5', transition:'none', retinaImage:true, retinaUrl:true});

                //Example of preserving a JavaScript event for inline calls.
                $("#click").click(function(){ 

                    $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here.");
                    return false;
                });


               $("[id$=LinkButton2]").click(function() {
              alert('child');
                $.ajax({
                  type: "POST",
                 url: "Default4.aspx/lnkbtn1",
                  data: "{}",
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  success: function(msg) {
                    alert(msg.d);
                    // Replace the div's content with the page method's return.
                    $("#[id$=LinkButton2]").attr('href',msg.d);

                  }
                });

             });
             $(".iframe").colorbox({iframe:true, width:"60%", height:"80%"});
            });
        </script>
    <style type="text/css">
        .arrowlistmenu
        {
            width: 180px; /*width of menu*/
        }
        .arrowlistmenu .headerbar
        {
            font: bold 14px Arial;
            color: white;
            background: black url(media/titlebar.png) repeat-x center left;
            margin-bottom: 10px; /*bottom spacing between header and rest of content*/
            text-transform: uppercase;
            padding: 4px 0 4px 10px; /*header text is indented 10px*/
        }
        .arrowlistmenu ul
        {
            list-style-type: none;
            margin: 0;
            padding: 0;
            margin-bottom: 8px; /*bottom spacing between each UL and rest of content*/
        }
        .arrowlistmenu ul li
        {
            padding-bottom: 2px; /*bottom spacing between menu items*/
        }
        .arrowlistmenu ul li a
        {
            color: #A70303;
            background: url(media/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
            display: block;
            padding: 2px 0;
            padding-left: 19px; /*link text is indented 19px*/
            text-decoration: none;
            font-weight: bold;
            border-bottom: 1px solid #dadada;
            font-size: 90%;
        }
        .arrowlistmenu ul li a:visited
        {
            color: #A70303;
        }
        .arrowlistmenu ul li a:hover
        {
            /*hover state CSS*/
            color: #A70303;
            background-color: #F3F3F3;
        }
        .style1
        {
            width: 100%;
        }
        .style2
        {
            width: 99%;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

 <div id="Result">
        Click here for the time.</div>

    <p>
        <a runat="server" id="a" class='iframe' href="Uploadedfiles/Education Portal.xlsx.1.html">
            Outside Webpage (Iframe)</a></p>
    <p>
        <a runat="server" id="a1" class='iframe' href="~/Images/Desert.jpg">Image
            (Iframe)</a></p>


        <asp:LinkButton ID="LinkButton2" runat="server"  CssClass="iframe"
       >LinkButton</asp:LinkButton>



</asp:Content>

.CS

 [WebMethod]
    public static string lstbtn1()
    {

        return "Images/Desert.jpg";
    }

Answer 1

[WebMethod]
public static string lstbtn1()
{

    return "Images/Desert.jpg";
}

试试这个

使用jquery和Masterpage时不会触发Web方法

1 个答案: