隐藏iOS Titan上的键盘

Question

在我的钛金应用程序上，我有一个包含许多字段的表单（文本字段等），当我专注于文本字段时，它会显示ios键盘，当我在窗口上的某个位置单击时，我想隐藏它：

<Alloy>
  <Window id="home" >
    <View id="form">
      <Require type="view" id="myViewForm" src="form/etape_1" />
    </View>
  </Window>
</Alloy>

在myViewForm内部：

<Alloy>
    <View>
      <TextField id="name" hintText="name"/>
      <TextField id="telephone" hintText="Téléphone"/>
    </View>
</Alloy>

注意：如您所见，我有一个ID为“ telephone”的文本字段，将仅显示数字。

在我的控制器主文件上：

/*-----------------------------------------
|   |   EVENT LISTENER CLICK ON WINDOW
-------------------------------------------*/
$.home.addEventListener("click", hideSoftKeyboard);
/*-----------------------------------------
|   |   HIDE KEYBOARD 
-------------------------------------------*/
function hideSoftKeyboard(e){
    if(Ti.Platform.osname === 'android'){
         Ti.UI.Android.hideSoftKeyboard();
    } else {
        $.home.textField.blur();
    }
}

在android上运行良好，但是在ios上我遇到以下错误：

[ERROR] :  Script Error {
[ERROR] :      column = 103;
[ERROR] :      line = 12;
[ERROR] :      message = "undefined is not an object (evaluating '$.home.textField.blur')";
[ERROR] :      stack = hideSoftKeyboard;
[ERROR] :  }

有人可以帮我吗？谢谢。

Answer 1

这是给您的代码：

index.js

$.home.addEventListener("click", hideSoftKeyboard);

$.home.open();

function hideSoftKeyboard(e){
    if(OS_ANDROID){
         Ti.UI.Android.hideSoftKeyboard();
    } else {
        $.myViewForm.name.blur();
        $.myViewForm.telephone.blur();
    }
}

• 但也请记住，如果您未bubbleParent="false"在文本字段上进行设置 ，那么在您单击文本字段时，将立即触发窗口上的单击事件。
• 因此，请注意在整个窗口上使用click事件。
• 如果在窗口上使用click事件的目的只是为了使用电话布局键盘在iOS上隐藏键盘，那么我建议您查看此属性TextField keyboardToolbar，它将很好地满足您的目的。

这是隐藏电话键盘的完整跨平台代码。

index.js

$.home.open();

myViewForm.xml

<Alloy>
    <View layout='vertical'>
        <TextField id="MOBILE_FIELD" class="phone fields" platform="android" />

        <TextField id="MOBILE_FIELD" class="phone fields" platform="ios">
            <KeyboardToolbar>
                <Toolbar>
                    <Items>
                        <FlexSpace />
                        <Button title="DONE" onClick="hideKeyboard" />      
                    </Items>
                </Toolbar>
            </KeyboardToolbar>
        </TextField>
    </View>
</Alloy>

myViewForm.tss

// to accept only phone numbers, with + sign also..
".phone[platform=ios]" : {
    keyboardType : Ti.UI.KEYBOARD_TYPE_NUMBER_PAD,
}

".phone[platform=android]" : {
    inputType : [Ti.UI.INPUT_TYPE_CLASS_NUMBER]
}


".fields" : {
    top : 30
    width : '80%',
    height : 50,
    borderColor : 'black',
    borderWidth : 2
}

myViewForm.js

function hideKeyboard() {
    $.MOBILE_FIELD.blur();
}