爲什麼這個JQuery調用asp.net pagemethod加載整個頁面？

Question

這裏是我的HTML的一個片段：

<input id="btnGetDate" type="submit" value="Get Date" /> 
    <div id="Result"></div> 

<script type="text/javascript"> 

    $(document).ready(function() { 

     $("#btnGetDate").click(function() { 
      $.ajax({ 
       type: "POST", 
       url: "Date.aspx/GetDate", 
       data: "{}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function(msg) { 
        $("#Result").text(msg.d); 
       } 
      }); 
     }); 
    }); 

</script> 

我的頁面方法ID定義如下：

[System.Web.Services.WebMethod] 
    public static string GetDate() 
    { 
     return DateTime.Now.ToString(); 
    } 

當我點擊獲取日期按鈕，只見日期在屏幕上閃爍的第二，但整個頁面加載後，它消失了，當我在螢火蟲中查看它，我發現它正在做POST，但很快就消失了。任何想法如何解決這個問題？

Answer 1

嘗試從$("#btnGetDate").click()事件處理程序返回假：

$("#btnGetDate").click(function() { 
     $.ajax({ 
      type: "POST", 
      url: "Date.aspx/GetDate", 
      data: "{}", 
      contentType: "application/json; charset=utf-8", 
      dataType: "json", 
      success: function(msg) { 
       $("#Result").text(msg.d); 
      } 
     }); 
     return false; 
    }); 

Answer 2

karim79的解決方案將做在Internet Explorer中的工作 - 而是要確保它在Firefox和其他瀏覽器的工作原理，以及，你可能希望將輸入參數添加到將採用單擊事件的單擊處理程序中，並停止該事件。

$("#btnGetDate").click(function(ev) { 
    ev.stopPropagation(); 
    $.ajax({ 
     type: "POST", 
     url: "Date.aspx/GetDate", 
     data: "{}", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(msg) { 
      $("#Result").text(msg.d); 
     } 
    }); 
    return false; 
});