Блог

Главная - Вопросы по программированию - При программировании игры, как я могу предотвратить перемещение скрипта мимо назначения jQuery события щелчка?

При программировании игры, как я могу предотвратить перемещение скрипта мимо назначения jQuery события щелчка?

#javascript #jquery #css

#javascript #jquery #css

Вопрос:

Новое в JS и jQuery — работа над игрой в качестве упражнения.

У меня есть «кнопка», которой я назначил событие с помощью jQuery.

Эта кнопка изменяет некоторые объекты на экране на красный цвет, а затем пользователь должен щелкнуть по красным.

Когда я пишу код, подобный этому:

 $("button").click(turnObjectsRed);
if (~someobjects~ are red){
     do xyz
 }

В результате назначается событие click, а затем JS вычисляет оператор if, который, конечно, является ложным, потому что я еще не нажал на кнопку.

Я знаю, что мог бы переместить все аспекты игры внутри функции события щелчка, но моя цель — иметь:

Кнопка -> изменение среды -> вещи, которые происходят после изменения среды.

Как мне убедиться, что JS оценивает среду ПОСЛЕ нажатия кнопки?

Может быть, цикл while, который ожидает изменения логического значения?

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

1. Вы должны выполнить логику внутри turnObjectsRed метода или подключить другой прослушиватель событий щелчка. Прослушиватели событий выполняются в том порядке, в котором они подключены.

2. Вам нужно разобраться в программировании, основанном на событиях. Все, что происходит в результате того, что пользователь что-то делает, должно выполняться в обработчике событий.

3. Цикл while не будет работать. События не обрабатываются до тех пор, пока JavaScript не вернется в цикл событий браузера. Цикл while заблокирует приложение, переменные не изменятся. Вы могли бы сделать это с setInterval помощью этого, периодически проверяя переменную, но это обычно не одобряется.

4. @Barmar конечно! Это определенно имело для меня гораздо больше смысла, поскольку я выполнил это упражнение. Я полагаю, что мои инстинкты, что это все равно должно быть частью обработки событий, были правильными.

Ответ №1:

Определите некоторую функцию для оценки среды, а затем вызовите ее после изменения цвета ваших объектов. Это позволяет легко переоценить среду и в других местах.

 function evaluateEnvironment() {
    if (someObjectsAreRed) {
         // ... Do stuff
    }

    // Do other stuff
}

function turnSomeObjectsRed() {
    // Turn objects red

    evaluateEnvironment();
}

$('button').click(turnSomeObjectsRed);

Ответ №2:

Обработчики событий выполняются в порядке их добавления. Таким образом, вы можете добавить еще один после того, который что-то меняет, если хотите. В противном случае вставьте всю свою логику в первый обработчик событий.

 var $test = $('#test');

$test.on('click', function(){
    $test.toggleClass('red blue');
});

$test.on('click', function(){
  if ($test.hasClass('blue')) {
    console.log('you changed me to blue!');
  }
});  
 .red { color: red; }
.blue { color: blue; }  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="test" class="red">My Text</div>