javascript在按下回车时设置一个变量值

Question

我对 JavaScript 很陌生，但我确信必须有一种简单的方法来在 HTML 文本输入框中按下 enter 时设置变量值。

<input type='text' name='userEntry' class='inner-choice-entry' placeholder='Type your answer here' />

下面是在后台运行的，例如:

var userEntry;
function determineUserChoice(e) {
    if (e.which == 13 || e.keyCode == 13) {
        userEntry = document.getElementsByName('userEntry').value;      
    }
};

以下将用于向用户显示消息并提示他们输入值:

displayedLine = 'Please enter your name.';
$('.inner-content-text').html(displayedLine);
displayedChoiceLine = 'Your name is:';
$('.inner-choice-text').html(displayedChoiceLine);
determineUserChoice();
charName = userEntry;
$('.inner-content-sidebar-text-playername').html(charName);

在我的一生中，我无法弄清楚如何让函数“determineUserChoice”将“userEntry”变量设置为用户在按下回车键时输入的任何内容。可能有更简单的方法来解决这个问题。我的目标是向用户提出一系列问题，然后在按下回车键后显示在页面上，然后显示其他消息。

Answer 1

您可以执行以下操作。

为您的文本框上的按键事件附加一个事件处理程序。我已经使用它的 class='inner-choice-entry 来引用它。

$('.inner-choice-entry').keydown(determineUserChoice);

注意:如果您可以在输入字段中添加 id 属性，则可以使用 $('#userEntry')而不是 $('.inner-choice-entry')。

修改 determineUserChoice 函数如下。这是为了克服 Thierry J 的回答中提到的要点。 getElementsByName 方法返回具有给定名称的所有元素的数组。使用 getElementsByName('userEntry')[0].value 将仅获取第一个具有 name=userEntry 的此类元素的值。

function determineUserChoice(e) {
    if (e.which == 13 || e.keyCode == 13) {
        console.log('ok');
        userEntry = document.getElementsByName('userEntry')[0].value; //note the change here.
        console.log(userEntry);
    }
};

注意:同样如前所述，如果在字段中添加id，则可以得到如下值。

userEntry = document.getElementById('userEntry').value;