2012-03-26 32 views
5

Tuyên bố từ chối trách nhiệm: Tôi đang sử dụng jQuery Mobile 1.1.0 RC1 mà không phải là bản phát hành ổn định. Tôi có một liên kết mà cần phải gửi một yêu cầu AJAX và trả về một phản ứng JSON nhưng khi liên kết được nhấp vào có vẻ như là jQuery Mobile thay đổi HREF thành một băm (#) trong iOS Safari trên iPhone. Nó không làm điều này khi thử nghiệm trong trình duyệt với Đại lý người dùng iPhone. Dưới đây là HTML cơ bản của tôi và JS để hiển thị những gì tôi có:jQuery Mobile 1.1.0 RC1 Sửa đổi HREF cho các Bài đăng AJAX trong iOS Safari

<a href="/link/to/ajaxpost/">Send Ajax Request</a> 

và JS

$('#tab a').on('click', function(e){ 
     var $this = $(this); 
     var jsonUrl = $this.attr("href"); 
     alert(jsonUrl); 

     $.mobile.showPageLoadingMsg(); 

     $.ajax({ 
      type: "POST", 
      url: jsonUrl, 
      success: function(data) { 
       $.mobile.hidePageLoadingMsg(); 
       alert(data); 
      } 
     }); 
     return false; 
}); 

Giá trị cho "jsonUrl" trở thành "#" (thay vì url để yêu cầu ajax của tôi) và sau đó giá trị của biến dữ liệu trả về toàn bộ trang và không phải là nguồn cấp dữ liệu JSON mà tôi muốn. Điều kỳ lạ là điều này chỉ xảy ra trong iOS Safari trên iPhone. Nó hoạt động tốt và nguồn cấp JSON trở lại khi tôi thử trang web jQuery Mobile với một tác nhân người dùng khác trong OSX Safari hoặc Firefox.

Tôi đã thử thêm rel = "external" và data-type = "ajax" vào liên kết và nó không khắc phục được. Tôi cũng đang sử dụng jQuery Mobile 1.1.0 RC1, nhưng tôi không chắc đó có phải là vấn đề hay không nếu tôi không sử dụng jQuery Mobile đúng cách. Tôi cũng không có bất kỳ JS Mobile cụ thể khác trong mã của tôi, vì vậy có lẽ tôi đang thiếu một cái gì đó mà sẽ sửa lỗi này. Đánh giá cao sự trợ giúp.

+0

Tôi biết tôi có thể đặt URL cho liên kết trong thuộc tính dữ liệu và sau đó gọi với jQuery, nhưng phải có cách tốt hơn để thực hiện. Tôi không muốn phải đưa vào các thuộc tính dữ liệu cho mỗi liên kết. – Keith

+0

Cũng thử $ (tài liệu) .bind ("mobileinit", hàm() {$ .mobile.ajaxEnabled = false;}); nhưng không có may mắn – Keith

+0

Tôi không thể tái tạo vấn đề của bạn. http://jsfiddle.net/sDh4k/3/ – r0m4n

Trả lời

2

Thay vì:

$this.attr('href') 

Sử dụng này:

$this.data('href') || $this.attr('href') 

jQuery Mobile 1.1.0RC1 và trên (bao gồm phát hành 1.1.0) sẽ thiết lập các href cho bất kỳ liên kết đến # khi nó là nhấp vào và lưu trữ href trong thuộc tính data-href, cho đến khi hoàn thành công việc, sau đó đặt lại. Nó chỉ thực hiện điều này trên iOS Mobile Safari.

tôi đã viết blog nhiều hơn một chút về vấn đề này, có liên hệ với các vấn đề liên quan github thảo luận và một số thông tin về ứng dụng này với Ruby on Rails jQuery UJS đây:

http://scottwb.com/blog/2012/06/29/jquery-mobile-breaks-your-hrefs-on-ios-mobile-safari/

Các vấn đề liên quan