jquery在页面上注册多个按键事件

我有一个表单，我使用“下一步”和“上一步”按钮通过显示或隐藏每个后续字段来导航

<ol class="fs-fields">
                <ul>
                    <label>{{form.project_name.label_tag}}</label>
                    <input id="id_project_name" name="project_name" type="text" placeholder="Project Name" required/>
                    <button type="button" class="fs-next">Next</button>
                </ul>
                <ul>
                    <label>{{form.project_orgName.label_tag}}</label>
                    <input id="id_project_orgName" name="project_orgName" type="text" required>
                    <button type="button" class="fs-next">Next</button>
                    <button type="button" class="fs-previous">Back</button>
                </ul>
                <ul>
                    <label>{{form.project_orgWebsite.label_tag}}</label>
                    <input id="id_project_orgWebsite" name="project_orgWebsite" type="text" required>
                    <button type="button" class="fs-previous">Back</button>
                    <button type="submit" name="next" class="next action-button" value="">Submit for Review</button>
                </ul>
            </ol>

此功能第一次运行时效果很好，但只运行一次：

---

有人能帮我理解下一个enter（）函数不止一次地工作吗？

我将修复您代码的某些部分，例如，当您执行

$（'input'）.focus（）时您正在对html代码的所有输入标记触发焦点事件，我认为您不希望这样

// Variables with global scope.

var i;
var current_fs, next_fs, previous_fs; // Fieldsets.
var left, opacity, scale;             // Fieldset properties which we will animate
var animating;                        // Flag to prevent quick multi-click glitches

$(document).ready(function()
{
    i = 1;

    // Trigger the focus event only in the first input element.

    $('input#id_project_name').focus();

    // Register events listeners.

    clickNext();
    clickPrevious();
    nextOnEnter();
});

// Register a listener for click event on all elements with class ".fs-next".

function clickNext()
{
    $(".fs-next").click(function()
    {
        if (animating)
            return false;

        animating = true;
        current_fs = $(this).parent();
        next_fs = $(this).parent().next();

        // Hide the current fieldset with animation style.

        current_fs.animate(
            {opacity: 0},
            {
                step: function(now, mx) {

                    // As the opacity of current_fs reduces to 0, stored in "now"
                    // 1. Scale current_fs down to 80%.
                    scale = 1 - (1 - now) * 0.2;

                    // 2. Bring next_fs from the right(50%).
                    left = (now * 50) + "%";

                    // 3. Increase opacity of next_fs to 1 as it moves in.
                    opacity = 1 - now;

                    current_fs.css({'transform': 'scale(' + scale + ')'});
                    next_fs.css({'left': left, 'opacity': opacity});
                },
                duration: 800, 
                complete: function() {

                    current_fs.hide();
                    animating = false;

                    // Show the next fieldset.
                    next_fs.show();

                    // Set focus on next input.
                    next_fs.find("input").focus();

                    // Setup classes.
                    $('.dot' + i.toString()).addClass('completed').removeClass('current');
                    i = i + 1;
                    $('.dot' + i.toString()).addClass('current')
                }
            }
        );
    });
}

// Register a trigger of click event on all inputs when "enter key" is pressed.

function nextOnEnter()
{
    $('input').keypress(function(e)
    {
        if (e.which == 13)
            $(this).parent().find('.fs-next').click();
    });
}

按Enter键尝试以下操作：

function nextOnEnter() {
$('input').keypress(function(e){
    if(e.which == 13){//Enter key pressed
     $(this).parent().find('.fs-next').click();
    }
});
}

控制台中是否有错误？可能存在问题，因为页面上有多个.fs next按钮。你有工作/半工作演示吗？我也看不到调用NextonCenter的位置。我编辑了上面的jquery，以包含调用NextonCenter的位置代码。控制台中没有错误。有什么想法吗？你能在你的完整代码结束时控制台.log（动画）吗？我很好奇它是否到达了动画完成的末尾，它总是单击第一个fs next按钮。如果你真的点击下一步按钮。这将绑定到该特定按钮。在回车时，它总是单击第一个按钮。您只是使第一个按钮透明，但它仍然存在于源代码中。谢谢！这很有道理，而且效果很好。谢谢你！不客气！我将尝试为代码提供更好的格式，以防这对其他人有所帮助
function nextOnEnter() {
$('input').keypress(function(e){
    if(e.which == 13){//Enter key pressed
     $(this).parent().find('.fs-next').click();
    }
});
}