Пользовательская функция подсказки не совсем завершена

0

Я работаю над текстовой игрой в стиле браузера (это текстовая игра, в которой используются некоторые изображения/анимации, но текст для передачи истории/действий/команд). Раньше я работал через prompt("What is your class?"); (Warrior, Wizard ETC), но хотел создать свою собственную функцию для этого, чтобы сделать ее красивее. Ниже некоторого кода:

/*
    1st value: Message being asked
    2nd value: input field being used
    3rd value: message block where question is presented
*/
var _cprompt = cPrompt('What is your class?', 'dialog-input', 'dialog-text');
alert(_cprompt);

И это фактическая функция cPrompt();

/*
Custom prompt class
message: The message shown
inputField: The ID of the txtfield where the user inputs his answer
messageField: The textarea where the response appears
userInput: Empty variable to store the users input
*/

function cPrompt(mssg, inputFieldId, messageFieldId) {
    var message = mssg;
    var inputField = $('#'+inputFieldId);
    var messageField = $('#'+messageFieldId);
    var userInput = "";

    messageField.append(message);

    // Detect enter space being pressed in inputField
    inputField.keyup(function (e) {
        if (e.keyCode == 13) {
            userInput = inputField.val();
        }
    });
}

Пока все хорошо, но мне нужно это, чтобы остановить выполнение другого кода до тех пор, пока пользователь не заполнит ответ и не попал в него (похоже на prompt();), поэтому в этом случае он не будет выполнять alert(_cprompt); до тех пор, пока пользователь не внесет какой-либо ввод и не ударит ввод.

Я попытался сделать функцию максимально динамичной, но, пожалуйста, не стесняйтесь добавлять все, что может сделать ее лучше/быстрее/проще в использовании.

Спасибо за вашу помощь.

  • 0
    "но мне нужно, чтобы остановить выполнение другого кода, пока пользователь не заполнит ответ и не нажмет ввод" Это невозможно с javascript. Ваш единственный реальный вариант - использовать обратные вызовы. Вы не можете выборочно остановить части JavaScript. Если вы остановите одну часть, вы остановите все это. И, когда вы останавливаете все это, вы также прекращаете все взаимодействие пользователя со страницей, делая невозможным добавление текста к текстовому вводу.
  • 0
    Тогда как подскажет это сделать?
Показать ещё 4 комментария
Теги:
prompt

2 ответа

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

Использование обратного вызова - отличный способ выполнить действие после возникновения события. В этом случае событием будет "пользователь, заполняющий ответ". Посмотрите рабочий пример здесь http://jsfiddle.net/Q2qUK/2/.

<div id="dialog-text"></div>
<input id="dialog-input" />

В функции cPrompt вы можете запустить функцию обратного вызова, как и любую другую функцию, когда время будет правильным. Вместо того, чтобы возвращать значение, вы передаете результаты в качестве параметра функции обратного вызова.

function cPrompt(mssg, inputFieldId, messageFieldId, callback){
    var message = mssg;
    var inputField = $('#'+inputFieldId);
    var userInput = "";

    cNotify(messageFieldId, message);

    // Detect enter space being pressed in inputField
    inputField.on('keyup', function (e) {
        if (e.keyCode == 13) {
            userInput = inputField.val();
            callback(userInput);

            // If you want the callback to only be executed once,
            // unbind the keyup event afterwards.
            inputField.off('keyup');

            // Empty the input field after processing the user message.
            inputField.val('');
        }
    });
}

В качестве примера того, как позволить вашему кодированию отвечать на ввод пользователя, я создал эту функцию cNotify, чтобы показать ввод пользователя в элементе диалога-текста.

function cNotify(messageFieldId, message){
    $('#' + messageFieldId).append('<div>' + message + '</div>');
}

Для передачи обратного вызова используйте анонимную функцию в качестве параметра функции cPrompt.

cPrompt('What is your class?', 'dialog-input', 'dialog-text', function(_cprompt){

    // Here you put all the code you want to run after the user pressed enter.
    cNotify('dialog-text', _cprompt);
});
Поделиться
  • 0
    Что мне делать, если я просто хочу сохранить результат cPrompt в переменной, а не предупреждать его?
  • 0
    Вы можете поместить любой код в анонимную функцию обратного вызова. Хитрость заключается в том, чтобы продолжить с того места, где вы остановились в функции обратного вызова, а не сразу после вызова функции подсказки.
Показать ещё 5 комментариев
1

Использовать обратные вызовы.

function cPrompt(mssg, inputFieldId, messageFieldId, callback) {
    var message = mssg;
    var inputField = $('#'+inputFieldId);
    var messageField = $('#'+messageFieldId);

    messageField.append(message);

    // Detect enter space being pressed in inputField
    inputField.keyup(function (e) {
            if (e.keyCode == 13) {
                callback(inputField.val());
            }
    });
}

cPrompt('What is your class?', 'dialog-input', 'dialog-text', function (_cprompt) {
    alert(_cprompt);
});
Поделиться
  • 0
    Это здорово, но по какой-то причине он продолжает рассылать спам (_cprompt) ;. Кроме того, я не хочу, чтобы он выдавал alert (), который просто показывал мне, что значение правильно возвращено функцией.

Ещё вопросы

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