使用If语句切换Case-Javascript&;滑动分页

使用If语句切换Case-Javascript&;滑动分页,javascript,jquery,onclick,switch-statement,keypress,Javascript,Jquery,Onclick,Switch Statement,Keypress,这个代码怎么了?它应该捕获#ts#u container div中的所有点击,这些点击要么是按钮,要么是锚。它还应该捕获按键事件 我试图在每个案例中应用If语句,以确定是否按下键和/或单击,如果是,它会将新div名称重写到开关案例底部的表达式中,然后当前文本将淡出,新文本淡入。没有按键,工作正常。正如现在所写的,当你点击时它仍然可以正常工作,但我不能让它在按键事件时触发,我不确定我做错了什么 jQuery(document).ready(function($) { $('#ts_cont

这个代码怎么了?它应该捕获#ts#u container div中的所有点击,这些点击要么是按钮,要么是锚。它还应该捕获按键事件

我试图在每个案例中应用If语句,以确定是否按下键和/或单击,如果是,它会将新div名称重写到开关案例底部的表达式中,然后当前文本将淡出,新文本淡入。没有按键,工作正常。正如现在所写的,当你点击时它仍然可以正常工作,但我不能让它在按键事件时触发,我不确定我做错了什么

jQuery(document).ready(function($) {
    $('#ts_container').on('click keypress', 'button, a', function(e) {
        var id = $(this).attr("id");
        var fade_out;
        var fade_in;

        switch (id) {
            case 'start':
                if ((e.type === 'keypress' && e.which === 13) || (e.type == 'click')) {
                    fade_out = '#start_1';
                    fade_in = '#step_0';
                }
                break;
            case 'AC':
                if ((e.type === 'keypress' && e.which === 49 || e.which === 97) || (e.type == 'click')) {
                    fade_out = '#step_0';
                    fade_in = '#step_AC_1';
                }
                break;
            case 'step_AC_Continue_1':
                if ((e.type === 'keypress' && e.which === 13) ||
                    (e.type == 'click')) {
                    fade_out = '#step_AC_1';
                    fade_in = '#step_AC_2';
                }
                break;
            case 'Step_0_Option_1':
                if ((e.type === 'keypress' && e.which === 50 || e.which === 98) || (e.type == 'click')) {
                    fade_out = '#step_0';
                    fade_in = '#step_Heat_1';
                }
                break;
            case 'step_AC_Option_1':
                if ((e.type === 'keypress' && e.which === 49 || e.which === 97) || (e.type == 'click')) {
                    fade_out = '#step_AC_2';
                    fade_in = '#step_AC_3';
                }
                break;
            case 'step_AC_Option_2':
                if ((e.type === 'keypress' && e.which === 50 || e.which === 98) || (e.type == 'click')) {
                    fade_out = '#step_AC_2';
                    fade_in = '#step_AC_solution_electrical';
                }
                break;
            case 'step_AC_Option_3':
                if ((e.type === 'keypress' && e.which === 51 || e.which === 99) || (e.type == 'click')) {
                    fade_out = '#step_AC_2';
                    fade_in = '#step_AC_circuit_breaker';
                }
                default:
                    fade_out = '#start_1';
                    fade_in = '#step_0';
        }

        $(fade_out).fadeTo('fast', 0).css('visibility', 'hidden')
            .css('display', 'none');

        $(fade_in).delay(800).css('visibility', 'visible')
            .css('display', 'block').fadeTo('slow', 1);
    });
});

如果语句不正确,请在大多数
语句中插入括号:

if ((e.type === 'keypress' && e.which === 49 || e.which === 97) || (e.type == 'click'))
if ((e.type === 'keypress' && e.which === 50 || e.which === 98) || (e.type == 'click'))
if ((e.type === 'keypress' && e.which === 49 || e.which === 97) || (e.type == 'click'))
if ((e.type === 'keypress' && e.which === 50 || e.which === 98) || (e.type == 'click'))
if ((e.type === 'keypress' && e.which === 51 || e.which === 99) || (e.type == 'click')) 
&&
优先于
|
,因此它们最终是:

if (((e.type === 'keypress' && e.which === x) || e.which === y) || (e.type == 'click')) 
将其更改为:

if (e.type === 'keypress' && (e.which === x || e.which === y) || e.type == 'click') 
也就是说:

  • 它必须是带有code
    x
    y
    按键,或
  • 这是一个点击事件

您还将在
按钮
a
元素上注册事件处理程序:

.on('click keypress', 'button, a'
除非你已经把注意力放在了m上,否则他们通常不会听键盘事件

修复方法是单独声明函数,并按如下方式注册处理程序:

function handleEvent(e) {
    // Do stuf
}

$('#ts_container').on('click', 'button, a', handleEvent);
$(window).on('keypress', handleEvent);

请添加正确缩进的代码,这样的代码很难调试。尝试添加调试程序。嗨,Cerburs,谢谢你的帮助。不幸的是,这也不起作用,它仍然不能触发按键。是的,我发现了另一个问题。我已经更新了我的答案。事实上它没有起作用。它在第一个案例中就启动了,但之后就不起作用了。当第一个案例(加载第一页)并按下“继续”按钮或键盘上的“回车”键时,它将触发隐藏第一页并加载第二页。但在第二页上,什么都不起作用。下面是一个示例,它正在运行中
$(this.attr(“id”)正在引用错误的对象。。。你需要换一种方式,对于键盘盒。。。