2017-12-23 20 views
0

Ionic Cordova를 사용하여 iPhone 앱을 제작하고 있습니다. 로그인 화면 사용자 이름 입력 및 비밀번호 입력과 제출 버튼이 있습니다. 사용자 이름을 입력 한 후 비밀번호 입력에 집중하고 "돌아 가기"를 탭할 수 없습니다.Ionic2가 장착 된 iPhone/iPad에서 리턴 키를 눌러 다음 입력 방법은 어떻게됩니까?

<ion-list > 
    <ion-item> 
<div id="loginlogo"></div> 
    </ion-item> 
     <ion-item> 
     <ion-label stacked>Username</ion-label> 
     <ion-input type="text" name="usernameInput" (keyup.enter)="focusAndGo()" [(ngModel)]="usernameInput"></ion-input> 
     </ion-item> 

     <ion-item> 
     <ion-label stacked>Password</ion-label> 
     <ion-input type="password" id="passwordInput" name="passwordInput" [(ngModel)]="passwordInput"></ion-input> 
     </ion-item> 
    <ion-item><button (click)="logincontrol()" ion-button color="light" block>Login</button></ion-item> 
    </ion-list> 

을 내 login.ts는 다음과 같습니다 :

내 login.html은 다음과 같습니다

@ViewChild('passwordInput') nameInput; 
    focusAndGo() 
    { 
    var input = document.getElementById('passwordInput'); 
    input.focus(); 
    this.nameInput.setFocus(); 
    //this.nameInput.nativeElement.focus(); 
    //this.nameInput.nativeElement.setFocus(); 
    //this.passwordInput.focus(); 
    //alert(event.keyCode); 
    //if(event.keyCode ==13) 
    //{ 
    //this.passwordInput.focus; 
    //}  
    } 

내가 위의 주석 모든 노력을. 커서가 다음 입력으로 이동할 수 없습니다.

답변

1

나는

focusAndGo(e) 
{ 
    e.preventDefault(); 
    var input = document.getElementById('passwordInput'); 
    input.focus();  
} 
+0

당신 NTP 감사 초점을 설정하기 전에 기능

<ion-input type="text" name="usernameInput" (keyup)="focusAndGo($event)" [(ngModel)]="usernameInput"></ion-input> 

과로 preventDefault()를 사용에

전송 $ 이벤트, 당신이 포커스를 설정하기 전에 기본 동작을 방지한다고 생각합니다. 나는 시도 할 것이고 나는 결과를 당신에게 알려줄 것이다. – hijacker83

+0

도와 드릴 수있어서 기쁩니다. – NTP

+0

안녕하세요. NTP입니다. 미안해. 나는 커서가 패스워드 입력에 초점을 맞추지 않았을 때 리턴을 두 드렸을 때 나는 단지 테스트했다. 함수 호출이 끝나면'''àlert ('test');''를 호출하여 테스트합니다. 그것은 return 키를 누를 때 분명히 경고 메시지를 띄우지 만 암호 필드에 초점을 맞추지 않습니다. 왜 그것이 작동하지 않는 다른 제안이나 아이디어가 있습니까? 도와 줘서 고마워. – hijacker83