programing

iPad Safari-키보드 사라지기

nasanasas 2020. 12. 6. 21:36
반응형

iPad Safari-키보드 사라지기


iPad Safari 브라우저에서 포커스를 텍스트 상자에서 드롭 다운으로 변경해도 키보드는 여전히 남아 있습니다 ... 사용자가 텍스트 상자에서 흐리게 처리 할 때 키보드를 숨길 수있는 방법이 있습니까 (자바 스크립트를 사용하는 경우)?

간접적으로 말하면 (모바일 Safari에서) 동등한 것을 찾고 있습니다.

[tempTextField resignFirstResponder]; 

이에 대한 해결책은 http://uihacker.blogspot.com/2011/10/javascript-hide-ios-soft-keyboard.html 에서 찾았습니다 . 기본적으로 다음을 수행하십시오 (저에게 효과적이었습니다).

var hideKeyboard = function() {
    document.activeElement.blur();
    $("input").blur();
};

내 사이트에 성공적으로 로그인 한 후 iOS 5.0.1이 설치된 iPad가 키보드를 숨기지 않았습니다. 나는 단순히 자바 스크립트 명령을 실행하여 해결했습니다.

document.activeElement.blur();

성공적으로 로그인하면 이제 키보드가 올바르게 숨겨집니다. :-)


나는 이것이 약간 오래된 질문이라는 것을 알고 있지만 오늘 이것에 대한 답을 발견했고 대답은 당황 할 정도로 간단합니다 ... 나는 이것을 알아내는 것보다 더 많은 시간을 보냈습니다;)

키보드 표시를 방지하려면 :

<input type="text" name="someInput" />

jQuery UI datepicker 사용과 같은 작업을 원할 때 ...

다음 과 같이 readonly 속성을 추가하십시오 .

<input type="text" name="someInput" readonly="readonly" />

JS가 꺼진 사람들을 염두에 두려는 경우 항상 속성을 끄고 코드에 추가 할 수 있습니다.

$('[name=someInput]').attr('readonly','readonly');

도움이 되었기를 바랍니다.

다음은 개념을 보여주는 jsFiddle입니다. http://jsfiddle.net/3QLBz/5/


$("#txt").on("focus", function(){
    $(this).blur();
});

IPad에서 jquery UI datepicker와 함께 작동합니다.


기본적으로 iPad, iPhone 키보드는 입력이 포커스를 잃으면 사라져야합니다.


Safari가 cursor:pointer속성이있는 요소에 대한 클릭 이벤트 만 처리 한다는 것을 모바일 / 태블릿 장치에서 알아 냈습니다 .

드디어 cursor:pointer모바일 / 태블릿 기기의 body 태그에 추가했는데 매력처럼 작동합니다.

작은 샘플

body {
    @media screen and (max-width: 1024px) { // IPad breakpoint
      cursor: pointer; // Fix iPhone/iPad click issue
    }
  }
}

다른 텍스트 필드에서 .focus ()를 호출하면 키보드가 사라집니다. 나는 Sencha 터치 프레임 워크를 사용하고 있는데, 내가 언급하는 텍스트 필드는 Ext.Text 객체입니다.

나는 이것이 반 직관적이라는 것을 알고 있지만 그것은 나를 위해 작동하는 것 같습니다.


jQuery가없는 버전 :

function hideKeyboard () {
    document.activeElement.blur();
    Array.prototype.forEach.call(document.querySelectorAll('input, textarea'), function(it) { 
        it.blur(); 
    });
}

Sample.views.MessageBar.getComponent(0).blur();
document.activeElement.blur();
window.focus();
Sample.views.sendMessageBar.getComponent(0).setDisabled(true);

위의 코드를 사용할 수 있습니다. 첫 번째와 네 번째 줄은 해당 텍스트 필드를위한 것입니다. iPhone에서는 작동하지만 Android에서는 작동하지 않습니다. Iphone 3gs와 samsung galaxy s2를 사용해 보았습니다.


According to Apple Safari documentation, when you select a dropdown (select list) the iOS dismisses the keyboard and displays native iOS select control. Make sure you use SELECT element for your dropdown list

and also try adding this to your meta tags for the page

<meta name="apple-mobile-web-app-capable" content="yes" />

참고URL : https://stackoverflow.com/questions/5937339/ipad-safari-make-keyboard-disappear

반응형