Не удается отключить выбор на iPhone с помощью jquery

0

Я пытаюсь получить следующий код, который представляет собой просто две кнопки, которые запускают два разных сценария. при нажатии первой кнопки, вторая кнопка включается. Вторая кнопка должна удерживаться в течение 10 секунд, пока счетчик не засчитывается до активации второго скрипта. это хорошо работает на моем ноутбуке, но мне нужно заставить его работать на моем iPhone. Когда я пытаюсь удерживать вторую кнопку, появляется выбор текста. нажатие второй кнопки один раз и отпускание приведет к тому, что обратный отсчет будет выполняться автоматически, но я хочу, чтобы только обратный отсчет происходил во время нажатия кнопки.

Я пробовал этот CSS -webkit-user-select: none; но я не мог заставить его работать, если я не делал это неправильно. Я хотел бы применить это ко всему документу.

Вот мой код:

<!DOCTYPE html>
<html>
<head>
<script src="jquery.min.js"></script>
<script type="text/javascript">

var countDownSecs = 10;
var check = null;

function printCountDown() {
    if (check == null && document.getElementById("counter").innerHTML != 'Launched!') {
        var cnt = countDownSecs;
            check = setInterval(function () {
                cnt -= 1;
                document.getElementById("counter").innerHTML = cnt;
                if (cnt == 0) {
                launch();
                  }
            }, 1000);
    }
}

function stop() {
    clearInterval(check);
    check = null;
    document.getElementById("counter").innerHTML = countDownSecs;
}

function launch() {
    $.ajax({
            type: "POST",
            url: "cgi-bin/launch.cgi"
        })
    clearInterval(check);
    check = null;
    document.getElementById("counter").innerHTML = 'Launched!';
}

    function ckcont() {
            $.ajax({
                    type: "POST",
                    url: "cgi-bin/ckcont.cgi"
                    })
}

</script>
</head>
<body>

<button id="continuity">Check Continuity</button>

<script>
$(document).ready(function(){
  $("#continuity").click(function(){
$("p").toggleClass("main");
$("#launch").removeAttr("disabled");
ckcont();
  });
});
</script>

<button id="launch" disabled="disabled">&nbsp;&nbsp;&nbsp;Count Down:&nbsp;
<span id="counter"><script>document.write(countDownSecs);</script></span>
</button>

<script>
$("#launch").bind( "mousedown touchstart", function() {
if (check != null){
    stop();
}
//$( "body" ).append( "<span style='color:#f00;'>Mouse up.</span><br>" );
});

$("#launch").bind( "mouseup touchend", function() {
printCountDown();
//$( "body" ).append( "<span style='color:#00f;'>Mouse down.</span><br>" );
});
</script>
</body>
</html>
Теги:

1 ответ

0
Лучший ответ

использовать это:

-webkit-touch-callout: none;
Поделиться
  • 0
    Я попробую это, спасибо. Можете ли вы помочь мне с тем, где разместить код, чтобы он применялся ко всему документу? Я новичок в веб-разработке.
  • 0
    {-webkit-touch-callout: none;} поместите это в свой файл CSS или раздел CSS в формате html. Если вы используете asterix ( ), свойство применяется ко всем элементам.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню