2015-12-05 3 views
-3

Я хочу создать игру, где после потери 3 жизней игра окончена. У меня есть элемент отображения HTML, представляющий число жизней у игрока:Переменная Javascript и элемент ввода HTML

<input type="display" value="3" id="display"> 

и у меня есть функция JQuery, которая уменьшает значение:

$('#display').val(parseInt($('#display').val()) - 1); 

Как бы значение входного элемента HTML быть хранится в переменной? Ниже не работает:

var lives = parseInt('#display'); 
+4

Вы уже есть: 'вар живет = $ ('# дисплей') вал()'. или 'var lives = parseInt ($ ('# display'). val(), 10)' - последнее не является обязательным для jQuery, возвращающего число, если числовое значение – mplungjan

+1

'display' не является допустимым' input' 'type' , Также 'значение' может быть изменено действием пользователя? – guest271314

ответ

1

Чтобы сохранить его, необходимо использовать .val(). Поэтому изменить его на:

var lives = parseInt($('#display').val(), 10); 

И вам нужно вызвать следующий код:

$('#display').val(parseInt($('#display').val()) - 1); 

, когда что-то происходит. Скажем, onkeypress или onmousemove.

И изменить ваш <input /> тега type в text и дать readonly:

<input type="text" value="3" id="display" readonly /> 
+0

Я думал, что parseInt берет строку, я надеюсь, вы имеете в виду, что это должно быть 'var lives = $ ('# display'). Val()' –

+0

@sandeeps. Готово. –

+0

@sandeeps - parseInt берет все, что вы бросаете на него. Включая номер. Например, parseInt (10.5,10) вернет 10 – mplungjan

0

Попробуйте хранить lives в Number, установка inputtype в "text", декремента lives на действия пользователя, устанавливая input значение lives. Если lives равно 0, удалить событие или прекратить призывающую функцию, декрементах lives переменная

var lives = 3; 
 
$("#display").val(lives); 
 

 
$(document).click(function() { 
 
    $("#display").val(--lives); 
 
    // if `lives` is equal to `0` 
 
    if (!lives) { 
 
    $(this).off("click"); 
 
    $("div").html("Game over") 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> 
 
</script> 
 

 
<body> 
 
    <div>click</div> 
 
    <br> 
 
    <input type="text" value="" id="display" disabled="true"> 
 

 
</body>

Смежные вопросы