2

誰かがこのコードhttps://github.com/jquery/jquery/blob/master/src/event.js#L646-L670を説明できますか?

ノックアウトを使用していますが、Opera に問題があります。再現しようとしましたが、問題なく動作するため、適切なケースがあるかどうかわかりません。

<div class="wrapper" data-bind="event: { mouseover: function() {}, mouseout: function() {} }">
    wrapper
    <div class="nested" title="nested">
        nested
    </div>
</div>

http://jsfiddle.net/uzbCB/

問題は、イベントをラッパーにバインドすると、ネストされた要素のバインドが失敗することだと思いました。

私はプロジェクトでこのケースを持っています.koイベントバインディングはラッパーにあり、ネイティブマウスオーバーはネストされた要素では機能しません. ネイティブのマウスオーバー動作 - マウスオーバー時に「タイトル」タグを表示します。だからうまくいかない。

jsfiddle でわかるように、正常に動作するので、わかりません。

この jQuery のコードをノックアウトのイベント バインディング コードに実装したところ、問題なく動作するようになりましたが、その状況がはっきりしているとは言えません。

君の力が必要!

これは ko バインディングの結果です:

ko.bindingHandlers.dgEvent = {
    'init' : function (element, valueAccessor, allBindingsAccessor, viewModel) {
        var eventsToHandle = valueAccessor() || {};
        for(var eventNameOutsideClosure in eventsToHandle) {
            (function() {
                var eventName = eventNameOutsideClosure; // Separate variable to be captured by event handler closure
                if (typeof eventName == "string") {
                    ko.utils.registerEventHandler(element, eventName, function (event) {
                        var handlerReturnValue;
                        var handlerFunction = valueAccessor()[eventName];
                        if (!handlerFunction)
                            return;
                        var allBindings = allBindingsAccessor();

                        // jQuery's workaround Opera's mouseover issue.
                        // If we have event binding on wrapper - native mouseover
                        // title tooltip bindings on nested elements wouldn't work.
                        // https://github.com/jquery/jquery/blob/master/src/event.js#L646-L670
                        if ( eventName === 'mouseover' || eventName === 'mouseout' ) {
                            var ret,
                                target = this,
                                related = event.relatedTarget,
                                handleObj = event.handleObj;

                            // For mousenter/leave call the handler if related is outside the target.
                            // NB: No relatedTarget if the mouse left/entered the browser window
                            if ( !related || (related !== target ) ) {
                                event.type = handleObj.origType;
                                ret = handlerFunction.apply( this, arguments );
                                event.type = eventName;
                            }
                            return ret;
                        }

                        try {
                            // Take all the event args, and prefix with the viewmodel
                            var argsForHandler = ko.utils.makeArray(arguments);
                            argsForHandler.unshift(viewModel);
                            handlerReturnValue = handlerFunction.apply(viewModel, argsForHandler);
                        } finally {
                            if (handlerReturnValue !== true) { // Normally we want to prevent default action. Developer can override this be explicitly returning true.
                                if (event.preventDefault)
                                    event.preventDefault();
                                else
                                    event.returnValue = false;
                            }
                        }

                        var bubble = allBindings[eventName + 'Bubble'] !== false;
                        if (!bubble) {
                            event.cancelBubble = true;
                            if (event.stopPropagation)
                                event.stopPropagation();
                        }
                    });
                }
            })();
        }
    }
}
4

0 に答える 0