1

SOのコメントは固定されており、実装を理解するのが難しいことがわかりました. 次のリンクは、コメントを固定する例です。

http://SO/questions/26696064/slug/26699358?noredirect=1#comment41994753_26699358

html に関する私の理解から、 html ページにはcomment41994753_26699358afterが存在する必要がありますが、 orが#見つかりませんでした。ソース コードを読むと、関連するソース コードしか見つかりません。idname

<div id="comments-26699358" class="comments ">
        <table>
            <tbody data-remaining-comments-count="0" data-canpost="true" data-cansee="false" data-comments-unavailable="false" data-addlink-disabled="false">
               <tr id="comment-41994753" class="comment ">

このスニペットは、2 つの相対 ID と分離 ID のみを教えてくれid="comment-41994753"ます。id="comments-26699358"最終的なアンカーcomment41994753_26699358はそれらから生成されますか? それとも、これは SO が使用するフレームワークに関連していますか?

4

2 に答える 2

2

これはブラウザーの動作ではなく、オレンジ色の背景色とそのスクロール表示は JavaScript で発生します。

コードは次のファイルにあります: http://cdn.sstatic.net/Js/full.en.js
縮小されていないバージョン: http://dev.stackoverflow.com/content/js/full.js

重要な機能は次onHashChange_HighlightDestinationのdoHighlightとおりです。

onHashChange_HighlightDestination:
ハッシュ引数を解析します。たとえば#comment49509148_30726127、その後に highlight メソッドを呼び出します。

// answers have the form 'lies-like/58534#58534'; comments are 'lies-like/58534#comment60949_58534'
var match = decodeURI(url).match(/#(\d+|comment(\d+)_(\d+))/i);
if (!match) return; // moderator viewing a flagged question, e.g. 'lies-like#question'

if (match[2])
    highlightComment(match[2], match[3]);
else
    highlightAnswer(match[1]);

doHighlight: このメソッドは、最後にそれを強調表示し (オレンジ色の背景)、関数でコメント/回答をスクロールして表示しますscrollIntoView。

var doHighlight = function (jEle) {
    var originalColor = backgroundColor;
    jEle
        .css({ backgroundColor: highlightColor })
        .animate({ backgroundColor: originalColor }, 2000, 'linear', function () { $(this).css('background-color', ''); });

    if (jEle.is('.comment'))
        jEle[0].scrollIntoView(true);
};
于 2015-06-09T08:44:50.663 に答える
2

その答えはonHashChange_HighlightDestination、メソッドから呼び出される JavaScript コード内の関数にあります。この関数は、initリクエストごとに起動します。

JavaScript コードの開発者版でわかるように、リクエスト ハッシュから投稿 ID とコメント ID を抽出しようとします。

var match = decodeURI(url).match(/#(\d+|comment(\d+)_(\d+))/i);

そこからhighlightComment、scrollIntoViewと CSS の強調表示を行う を呼び出します。

于 2015-06-09T08:56:34.707 に答える