如何用按钮激活键盘？

Question

我是新手。 我正在使用Phonegap做android（在未来的iOS和iOS）应用程序。当我点击某个按钮并关闭按钮时，我希望我的键盘打开。我在https://github.com/driftyco/ionic-plugins-keyboard添加离子键盘插头，在html中添加按钮：

<div class="button">
             <button id="open_keyb">Click Me!</button>
         </div>

和javascript：

var app = {
    // Application Constructor
    initialize: function() {
        this.bindEvents();
    },
    // Bind Event Listeners
    //
    // Bind any events that are required on startup. Common events are:
    // 'load', 'deviceready', 'offline', and 'online'.
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    // deviceready Event Handler
    //
    // The scope of 'this' is the event. In order to call the 'receivedEvent'
    // function, we must explicitly call 'app.receivedEvent(...);'
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
        alert(1);
        cordova.plugins.Keyboard.show();
    },
    // Update DOM on a Received Event
    receivedEvent: function(id) {
        var parentElement = document.getElementById(id);
        var listeningElement = parentElement.querySelector('.listening');
        var receivedElement = parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }
};

  app.run(function($ionicPlatform) {
    $ionicPlatform.ready(function() {
        if(window.cordova){
            cordova.plugins && cordova.plugins.Keyboard && cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }
        alert('test');
    });
});

app.directive('input', function($timeout){
    return {
        restrict: 'E',
        scope: {
            'returnClose': '=',
            'onReturn': '&',
            'onFocus': '&',
            'onBlur': '&'
        },
        link: function(scope, element, attr){
            element.bind('focus', function(e){
                if(scope.onFocus){
                    $timeout(function(){
                        scope.onFocus();
                    });
                }
            });
            element.bind('blur', function(e){
                if(scope.onBlur){
                    $timeout(function(){
                        scope.onBlur();
                    });
                }
            });
            element.bind('keydown', function(e){
                if(e.which == 13){
                    if(scope.returnClose) element[0].blur();
                    if(scope.onReturn){
                        $timeout(function(){
                            scope.onReturn();
                        });
                    }
                }
            });
        }
    }
});
 .run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
    ionic.Platform.isFullScreen = true;
  });
})

var fn = function() {

    alert('test');
    document.getElementById('one').onclick = function() {
        alert('click');
        cordova.plugins.Keyboard.show();
    };

};

document.addEventListener('DOMContentLoaded', fn, false);

在www文件夹中。 这不起作用。此警报也未显示。你能帮助我吗？如何使这个工作？

Answer 1

没有将事件监听器添加到open_keyb按钮，因此不会触发任何事件。

此外，由于您似乎正在使用移动设备，因此您可能也希望添加touchend事件，尽管click在任何情况下都应该正常工作。

请尝试更换：

var fn = function() {

    alert('test');
    document.getElementById('one').onclick = function() {
        alert('click');
        cordova.plugins.Keyboard.show();
    };

};

document.addEventListener('DOMContentLoaded', fn, false);

用这个：

document.addEventListener('DOMContentLoaded',function(DOMLoaded){
   document.getElementById('open_keyb').addEventListener('click', function (clickEvent){
       alert('click');
       cordova.plugins.Keyboard.show();
   });
});