2011-09-25 155 views
6

我正在開發一個Web應用程序,並正在使用jQuery爲用戶提供一個良好的用戶界面。因此,我使用ajax請求和許多jQuery函數。如果JavaScript在瀏覽器中被禁用,請求Ajax請求是否有效?

如果我在瀏覽器中禁用JavaScript,大部分函數將無法工作,因爲我正在爲許多函數發送異步ajax請求。但我該如何處理?我是否需要重寫代碼而不使用jQuery和ajax?

查找下面的樣本按鈕單擊事件:

$("#renameCategory").live('click', function (event) { 
     if ($.trim($("#CategoryNewName").val()) == "") { 
      alert("Please enter a category name"); 
      return; 
     } 
     var selectedCategory = $("#SelectedCategoryId").val(); 
     var newCategoryName = $("#CategoryNewName").val(); 
     var postData = { categoryId: selectedCategory, name: newCategoryName }; 
     $.ajax({ 
      type: "POST", 
      url: '@Url.Action("UpdateCategoryName", "Category")', 
      data: postData, 
      dataType: "json", 
      success: function (data) { 
       $('#' + selectedCategory).text(newCategoryName); 
       $("#selectedCategoryText").html(newCategoryName); 
      }, 
      error: function() { alert('error') } 
     }); 
    }); 

我該如何處理呢?

回答

12

當客戶端禁用JavaScript時,Ajax請求和jQuery不起作用。使這項工作的最好方法是使用URL從<a>標籤href的:

<a href="@Url.Action("UpdateCategoryName", "Category")">Click Me!</a> 

$("#renameCategory").on('click', function (evt) { 
     //To prevent the link from sending the default request 
     //call preventDefault() on the jQuery event object 
     evt.preventDefault(); 
     // 
     if ($.trim($("#CategoryNewName").val()) == "") { 
      alert("Please enter a category name"); 
      return; 
     } 
     //GET THE URL FOR THE AJAX REQUEST 
     var actionUrl = $(this).attr('href'); 
     // 
     var selectedCategory = $("#SelectedCategoryId").val(); 
     var newCategoryName = $("#CategoryNewName").val(); 
     var postData = { categoryId: selectedCategory, name: newCategoryName }; 
     $.ajax({ 
      type: "POST", 
      url: actionUrl, 
      data: postData, 
      dataType: "json", 
      success: function (data) { 
       $('#' + selectedCategory).text(newCategoryName); 
       $("#selectedCategoryText").html(newCategoryName); 
      }, 
      error: function() { alert('error') } 
     }); 
    }); 

您還需要在你的控制器檢查Ajax請求如下圖所示:

public ActionResult UpdateCategoryName() { 
    ... 

    if(Request.IsAjaxRequest()) { 
     return Json(yourData); 
    } 

    return View(); 
} 

這方式,如果您的用戶禁用JavaScript,則鏈接將像普通的HTTP請求那樣運行。如果用戶啓用了JavaScript,那麼他們將獲得Ajax體驗。這叫做graceful degradation

2

當啓用javascript時,Ajax調用起作用。

你可以通過服務器端腳本來處理它,當javascript被禁用時,你必須通過post/get請求來工作,所以你必須重新編碼你的web應用程序。

2

如果在瀏覽器中禁用JavaScript,則<script>標記將不會在文檔中解釋和執行,包括所有jQuery和AJAX JS代碼。實現JavaScript以外的交互式Web應用程序的最常用方式是Flash,因此您仍然可以制定備份計劃。您也可以使用舊式服務器端只生成動態頁面。

今天,對於沒有啓用JavaScript的用戶來說這是非常罕見的,所以它不應該成爲一個問題。

無論如何,您可以使用<noscript> html標籤向這些用戶顯示消息。

<script type="text/javascript"> 
    ... Js code ... 
</script> 
<noscript>You have JavaScript disabled in your browser. Please enable it.</noscript> 
2

顯然,如果腳本被禁用,不可用或不符合它試圖在運行環境

它被許多人認爲是一個很好的策略,這取決於腳本任何功能將無法正常工作。開發Web應用程序,以便在沒有腳本支持的情況下工然後,您可以添加腳本來改進工作流程和效率,但是如果知道腳本無法運行的任何時候,您已經回退到可用的系統,就會這樣做。

基於HTML和表單的設計和實現良好工作流程的規範可能會導致更簡單的腳本界面和更高效的工作流程。

開發人員經常將一些最小的HTML和CSS放在一起,然後嘗試在腳本中執行所有操作。最重要的是要有一個DOCTYPE,標題元素,一個塊元素和一個腳本元素來完成一切。不建議。

2

如果您的網站需要進行大量修改而無需使用JavaScript,那麼只需強制用戶啓用javascript即可。通知用戶啓用JavaScript的一種方法是使用noscript標籤。 http://www.w3schools.com/tags/tag_noscript.asp

查看stackoverflow的頁面源碼查看他們如何使用noscript