1

当我单击文本字段时，我在我的 sencha 项目中包含以下代码以在 iphone、HTML 内容中进行测试。未启用或未显示键盘.,但按钮正常响应

var additemspnl = Ext.create('Ext.Panel', {
    id: 'additemspnl',
    scrollable:'vertical',
    height: '100%',
    width: '100%',
   html:'<div style="padding:10px;"><input type="text" class="txtfield" id="tx   titemname" placeholder="ITEM NAME" />
         <br><input class="txtfield" id="txtitemdesc" type="text" placeholder="ITEM DESCRIPTION"/><br><input class="txtfield"  id="txtprice" type="range" name="points" min="1" max="10000">
         <br><input type="number" class="txtfield" id="txtitemprice" placeholder="PRICE"/><div>
         <table style="padding:0px;margin-bottom:0px;"><tr><td align="center"><img src="resources/img/iconaddimage.png" id="productpic" /></td>
         <td align="center"><img src="resources/img/iconshowlocation.png" id="imglocation" /></td></tr></table></div>
         <input type="text" class="txtfield" placeholder="SHOW LOCATION" id="txtlocation"/><br>
         <input type="text" class="txtfield" placeholder="WISH CATEGORY"/><br>
         <input type="text" class="txtfield" id="txtshopurl" placeholder="SHOP NAME OR URL"/><div align="center" style="padding-top:20px;">
         <img src="resources/img/buttondone.png" id="btndone"></div></div>',
        items: [{
            xtype: 'toolbar',
            ui:'light',
            docked: 'top',
            title: 'Add items'
               }]
        });

我应该做些什么改变来启用文本字段？请帮助我

4

1 回答 1

0

我发现发布的代码有两个问题。

1) html 字符串没有正确处理多行，所以我必须连接每一行以形成一个字符串。

2）我不得不将高度和宽度属性更改为全屏：真。

我能够正确显示 html 表单和工具栏，并且在这两个更改后它们的 iOS 键盘可用。

重新格式化的代码

    var additemspnl = Ext.create('Ext.Panel', {
        id: 'additemspnl',
        scrollable:'vertical',
        fullscreen: true,
        html:'<div style="padding:10px;"><input type="text" class="txtfield" id="tx   titemname" placeholder="ITEM NAME" />' +
        '<br><input class="txtfield" id="txtitemdesc" type="text" placeholder="ITEM DESCRIPTION"/><br><input class="txtfield"  id="txtprice" type="range" name="points" min="1" max="10000">' +
        '<br><input type="number" class="txtfield" id="txtitemprice" placeholder="PRICE"/><div>' +
        '<table style="padding:0px;margin-bottom:0px;"><tr><td align="center"><img src="resources/img/iconaddimage.png" id="productpic" /></td>' +
        '<td align="center"><img src="resources/img/iconshowlocation.png" id="imglocation" /></td></tr></table></div>' +
        '<input type="text" class="txtfield" placeholder="SHOW LOCATION" id="txtlocation"/><br>' +
        '<input type="text" class="txtfield" placeholder="WISH CATEGORY"/><br> ' +
        '<input type="text" class="txtfield" id="txtshopurl" placeholder="SHOP NAME OR URL"/><div align="center" style="padding-top:20px;">' +
        '<img src="resources/img/buttondone.png" id="btndone"></div></div>',
        items: [{
            xtype: 'toolbar',
            ui:'light',
            docked: 'top',
            title: 'Add items'
        }],            
    });

注意：您可能希望查看 Sencha Touch 的表单面板来执行表单 UI，而不是执行原始 html。

这里有一个例子。单击用户界面，然后单击表单。您也可以查看源代码。

于 2013-09-16T01:43:52.640 回答