bqio

Задание (квест) - это слушатель действий игрока. Как только игрок совершает определенное действие, меняются текущие условия задания. В Вашем движке должен быть некий middleware, который будет слушать все действия и все активные задания и когда условия задания будут выполнены, он его отметит как завершенное и больше слушать его не будет. Когда игрок будет набирать воду, у вас в коде должно изменяться состояние задания.

Через этот middleware должны будут проходить все действия пользователя, а ядро уже, по их типу, будет определять "тип" действия (набор воды) и изменять состояние задания.

Я вижу это так. Остальные могут меня поправить.

Что?

let date = new Date();
console.log(date);

let inputListener;
let ms = 1500;
input.addEventListener('keyup', () => {
 clearTimeout(inputListener);
 inputListener = setTimeout(() => {
   // ajax
 }, ms);
});

https://ru.vuejs.org/v2/guide/components-slots.html

<component>
  <component2></component2>
</component>

Component template:

<component>
  <slot></slot>
</component>

https://stackoverflow.com/a/13944710

Можно.

1. https://developer.mozilla.org/ru/docs/Web/API/Even...
2. https://developer.mozilla.org/ru/docs/DOM/document...
3. https://developer.mozilla.org/ru/docs/Web/API/Node...
4. https://developer.mozilla.org/ru/docs/Web/API/Even...

1. Лучше использовать ID, если есть возможность, а не атрибут;
2. Зачем привязали к переменной? Вы ради этой отвязки и используете Jquery;
3. .html() полностью заменяет содержимое блока, .append() - добавляет новое.

$('#ID').click(function(){
    $('#ID').append('<li></li>');
});

Потому что метод вызывается до того, как добавится новый HTML.

$("button ").click(myfunc);

function myfunc(){

$("#block").html($('<input id="next" style="height: 50px;" class="form-control" name="login" placeholder="Insert"><br><button type="button" class="btn btn-primary"  id="bth">Продолжить</button>'))
$("#bth").click(myfuns);
}

function myfuns() {
alert("Работает");
}