Невозможно нажать кнопку html на iPhone

#javascript #html #iphone #mobile-safari

#javascript #HTML #iPhone #мобильный-safari

Вопрос:

Я пытаюсь нажать кнопку на экране iPhone. На моем компьютере это работает нормально. На iPhone кнопка подсвечивается, как будто браузер safari пытается ее выбрать.

 <html>
<head>
</head>
<link rel="stylesheet" href="style.css">
<body id="body" overflow="hidden" bgcolor="black" text="white">
<center>
<div class="content">
    <div class="buttons">
        <div class="button button1" id="button1"></div>
        <div class="button button2" id="button2"></div>
</div>
</center>
</body>
<script src="engine-portal.js"></script>
<script src="socket.io.js"></script>
<script src="controller.js"></script>
<script src="controller-link.js"></script>
</html>

<style type='text/css'>
canvas {
  /*border: 1px solid #aaa;*/
  cursor: none;
}
</style>

<script>

</script>



'use strict';

class Controller extends Portal {
    setup() {

    }

    connectToServer() {
        this.io = io();
        this.io.portal = this;
        console.log("test");
        this.io.emit('join', {});
    }

    installCanvas() {
    }

    installInput() {
        var b1 = document.getElementById('button1');
        b1.addEventListener("mousedown", this.b1down);
        b1.addEventListener("mouseup", this.b1up);
        b1.controller = this;
        var b2 = document.getElementById('button2');
        b2.addEventListener("mousedown", this.b2down);
        b2.addEventListener("mouseup", this.b2up);
        b2.controller = this;
    }

    b1down(event) {
        var target = event.srcElement || event.currentTarget || event.target;
    target.controller.b1Press();
    }

    b2down(event) {
        var target = event.srcElement || event.currentTarget || event.target;
    target.controller.b2Press();
    }

    b1up(event) {
        var target = event.srcElement || event.currentTarget || event.target;
    target.controller.b1Release();
    }

    b2up(event) {
        var target = event.srcElement || event.currentTarget || event.target;
    target.controller.b2Release();
    }


    b1Press() {
        this.moveInput = -1;
    }

    b2Press() {
        this.moveInput = 1;
    }

    b1Release() {
        this.moveInput = 0;
    }

    b2Release() {
        this.moveInput = 0;
    }

    parseInput(key_pressed_map, key_up_map, key_pressing_map, key_depressing_map) {
        if (this.moveInput == 1) {
            this.io.emit('input', 'down');
        } else if (this.moveInput == -1) {
            this.io.emit('input', 'up');    
        }


    }
}
  

Комментарии:

1. Вероятно, это потому, что на самом деле это не кнопка. Попробуйте использовать <button> вместо <div> .

2. Я попробую это. Почему мой перехватчик касания не работает, хотя на adiv?

3. Просто нужно использовать touchup amp; tocuhdown