禁用Cordova / PhoneGap上的所有用户输入事件

Question

I would like to temporary disable all touch/virtual keyboard events in a hybrid Cordova/PhoneGap app. Is there some kind of plug-in to achieve this natively? Perhaps something, that disables the whole web view from any user input. If there isn't one, how can this be achieved with javascript/CSS/HTML?

PS I need this feature in order to make sure the user won't disturb the predefined animated scenario.

Answer 1

You can use javascript or a overlay to handle this.

Using javascript

var handler = document.addEventListener('click, touchEnd, touchStart, touch, keypress', function (evt) {
  evt.stopPropagation();
  evt.preventDefault();
});

Once your animation is complete use below to remove blocker;

handler.removeEventListener();

Or create a div with css

.overlay {
  width: 100%;
  height: 100%;
  display: block;
  z-index: 999999;
  position: absolute;
  top: 0;
  left: 0;
}

Once your animation is complete you can hide the div or remove it.