Ứng dụng web iPad: Ngăn chặn tiêu điểm đầu vào SAU KHI gọi ajax

Question

Vì vậy, tôi đã đọc xung quanh và không thể cho cuộc sống của tôi tìm ra để giải quyết vấn đề của tôi một cách hiệu quả.

Tóm lại, tôi có một ứng dụng web được xây dựng cho iPad - hoạt động như mong muốn. Tuy nhiên, tôi có một hình thức Ajax mà cũng nộp như nó phải. Tuy nhiên, sau callback và tôi xóa/đặt lại biểu mẫu của mình, "iPad" sẽ tự động tập trung vào đầu vào và mở lại bàn phím. Điều này là xa lý tưởng.

Tôi đã xoay xở để tìm đường, nhưng nó vẫn chưa hoàn hảo. Đoạn mã dưới đây chạy trên callback ajax của tôi, nó hoạt động - ngoại trừ vẫn có một đèn flash của bàn phím nhanh chóng mở và đóng.

Lưu ý, mã của tôi sẽ không hoạt động trừ khi tôi sử dụng setTimeout. Ngoài ra, từ sự hiểu biết của tôi, document.activeElement.blur(); chỉ hoạt động khi có sự kiện nhấp chuột, vì vậy tôi đã kích hoạt một sự kiện qua js.

TỪ CÁC LOẠI KHÁC, LÀM THẾ NÀO ĐỂ CHỐNG BÀN PHÍM MẠNG TỪ KHI SỬA SAU SAU KHI AJAX GỌI TRÊN ỨNG DỤNG WEB?

PS: Cuộc gọi Ajax hoạt động tốt và không mở bàn phím trong Safari trên iPad, chỉ chế độ ứng dụng web.

Dưới đây là mã của tôi:

hideKeyboard: function() { 

     // iOS web app only, iPad 
     IS_IPAD = navigator.userAgent.match(/iPad/i) != null; 

     if (IS_IPAD) { 
      $(window).one('click', function() { 
       document.activeElement.blur(); 
      }); 
      setTimeout(function() { 
       $(window).trigger('click'); 
      }, 500); 
     } 
    } 

Có lẽ nó liên quan đến cách tôi thanh toán bù trừ các hình thức của tôi, vì vậy đây là mã mà. Lưu ý, tất cả các yếu tố đầu vào đều có tabindex = "- 1".

clearForm: function() { 

     // text, textarea, etc 
     $('#campaign-form-wrap > form')[0].reset(); 

     // checkboxes 
     $('input[type="checkbox"]').removeAttr('checked'); 
     $('#campaign-form-wrap > form span.custom.checkbox').removeClass('checked'); 

     // radio inputs 
     $('input[type="radio"]').removeAttr('checked'); 
     $('#campaign-form-wrap > form span.custom.radio').removeClass('checked'); 

     // selects 
     $('form.custom .user-generated-field select').each(function() { 

      var selection = $(this).find('option:first').text(), 
       labelFor = $(this).attr('name'), 
       label = $('[for="' + labelFor + '"]'); 

      label.find('.selection-choice').html(selection); 
     }); 
     optin.hideKeyboard(); 
    } 

Answer 1

Khi tôi đăng một khoản tiền thưởng chết tiệt, tôi đã tìm ra nó - do nhầm lẫn. Go figure ... lol

Đối với bất kỳ ai khác gặp phải vấn đề này, tôi có vị trí "lớp phủ" div absolute qua biểu mẫu (được sử dụng làm thông báo Cảm ơn bạn được hiển thị trên thành công ajax). Rõ ràng điều này đã khiến bàn phím mở sau cuộc gọi Ajax. Vì lý do giao diện người dùng, tôi đã thay đổi vị trí thành position: fixed; và sự cố được đánh dấu trong câu hỏi ban đầu của tôi dường như đã tự sửa lỗi một cách bí ẩn. Lạ lùng ... rất thích biết tại sao nếu có ai biết ... tàn bạo.