【问题标题】:Prevent Enter Key (KeyCode 13) on input element within Colorbox from closing the colorbox防止 Colorbox 中输入元素上的 Enter Key (KeyCode 13) 关闭颜色框
【发布时间】:2013-04-10 13:27:40
【问题描述】:

我在 IE9 中遇到了一个奇怪的问题。

如果我将输入元素放在颜色框(内联 HTML)中,然后在所述输入元素具有焦点的情况下按 Enter - 颜色框关闭?

这在 Chrome 中不会发生。

我设置了一个 jsfiddle 来演示这个问题:

  • 打开小提琴:http://jsfiddle.net/rv74f/3/
  • 点击内嵌HTML链接
  • 单击生成的文本框以使其获得焦点
  • 按键盘上的 Enter - Colorbox 然后淡出?

我在选项中看不到任何可以防止/解释这种行为的内容?

如何防止 Enter 关闭颜色框而无法捕获所有输入元素上的按键事件?

我快速查看了颜色框源代码并注意到了 escKey: true, 等参数,但我看不到任何解释此 Enter Key 问题的信息?

编辑:

如果我将以下内容添加到publicMethod.close()

alert("caller is " + arguments.callee.caller.toString());

它告诉我 .close() 正在被 publicMethod.close() 调用

如果我改为添加以下内容(注意使用 caller.caller 进一步向上移动堆栈):

alert("caller is " + arguments.callee.caller.caller.toString());

我得到以下信息:

---------------------------
Message from webpage
---------------------------
caller is 
function( event ) {

    // Make a writable jQuery.Event from the native event object
    event = jQuery.event.fix( event );

    var i, ret, handleObj, matched, j,
        handlerQueue = [],
        args = core_slice.call( arguments ),
        handlers = ( jQuery._data( this, "events" ) || {} )[ event.type ] || [],
        special = jQuery.event.special[ event.type ] || {};

    // Use the fix-ed jQuery.Event rather than the (read-only) native event
    args[0] = event;
    event.delegateTarget = this;

    // Call the preDispatch hook for the mapped type, and let it bail if desired
    if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) {
        return;
    }

    // Determine handlers
    handlerQueue = jQuery.event.handlers.call( this, event, handlers );

    // Run delegates first; they may want to stop propagation beneath us
    i = 0;
    while ( (matched = handlerQueue[ i++ ]) && !event.isPropagationStopped() ) {
        event.currentTarget = matched.elem;

        j = 0;
        while ( (handleObj = matched.handlers[ j++ ]) && !event.isImmediatePropagationStopped() ) {

            // Triggered event must either 1) have no namespace, or
            // 2) have namespace(s) a subset or equal to those in the bound event (both can have no namespace).
            if ( !event.namespace_re || event.namespace_re.test( handleObj.namespace ) ) {

                event.handleObj = handleObj;
                event.data = handleObj.data;

                ret = ( (jQuery.event.special[ handleObj.origType ] || {}).handle || handleObj.handler )
                        .apply( matched.elem, args );

                if ( ret !== undefined ) {
                    if ( (event.result = ret) === false ) {
                        event.preventDefault();
                        event.stopPropagation();
                    }
                }
            }
        }
    }

    // Call the postDispatch hook for the mapped type
    if ( special.postDispatch ) {
        special.postDispatch.call( this, event );
    }

    return event.result;
}
---------------------------
OK   
---------------------------

那么,JQuery 函数正在调用 colorbox.close() 方法吗?现在我只需要弄清楚为什么......

谜团加深……

【问题讨论】:

  • @HeavenCore 然后添加internet-explorer-9 标签。
  • 检查这个小提琴jsfiddle.net/rv74f/4,现在它在IE9中也可以正常工作。它只是一个演示,你应该在keypress事件上调用一个函数并检查keycode,如果按下的键是一个回车键而不是只返回false,否则你目前不能在输入字段中输入任何文本
  • @gaurav 干杯,但这意味着为每个输入元素添加一个事件句柄 - 这是一个丑陋的解决方法,因为我要加载的输入元素是多种多样的,并且很可能有自己的事件句柄各种原因 - 这就是为什么我在我的问题中说“没有在我的所有输入元素上捕获按键事件”。
  • 任何解决方案
  • @Bogdan 不,还没有:'(

标签: javascript jquery internet-explorer internet-explorer-9 colorbox


【解决方案1】:

这似乎已解决 - 无法在 colorbox v1.4.33 (2013-10-31) 中重新创建问题

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-07-03
    • 1970-01-01
    • 2017-06-02
    • 1970-01-01
    • 2013-07-23
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多