javascript - Disqus の読み込み後に JavaScript を実行する方法

Question

Disqus API を使用しようとしていますが、Disqus コメント スレッドを変更する JavaScript コードを実行する必要があります。

Disqus スレッドがロードされた後に JavaScript コードを実行するにはどうすればよいですか?

Answer 1

同様の問題に遭遇しました。私が思いついた唯一の実用的な解決策は、実行setInterval()して Disqus コンテナ div の高さを確認することでした。

例：

var editable = true; // set a flag
setInterval(function() {
// Initially Disqus renders this div with the height of 0px prior to the comments being loaded. So run a check to see if the comments have been loaded yet.
  var disqusHeight = $('#dsq-2').height();
  if ( disqusHeight > 0 ) {
    if (editable) { // To make sure that the changes you want to make only happen once check to see if the flag has been changed, if not run the changes and update the flag.
      editable = false;
      // Your code here...
    }
  }
}, 100);

Answer 2

これは、新しいバージョンの Disqus 用に修正された Brandon Morse のコードで、Disqus がコメントをロードするとスクリプトが停止します。

var interval = setInterval(function() {
    var $ = jQuery;
    var disqusHeight = $('#disqus_thread').height();
    if ( disqusHeight > 52 ) {  // height 52px is header of Disqus, more than 52px means that disqus load comments
      // Your code
        clearInterval(interval); // after loaded comment we stop this script
    }
}, 100);

Answer 3

フラグを使用してループを回避します。

evento.add(window, "load", function () {
    var w = window,
    d = document,
    a = d.getElementById("disqus_thread") || "",
    disqus_shortname = a ? (a.dataset.shortname || "") : "",
    embed_js_src = ("https:" == w.location.protocol ? "https" : "http") + "://" + disqus_shortname + ".disqus.com/embed.js",
    g = ".grid",
    h = ".grid-item",
    k = ".grid-sizer",
    grid = d.querySelector(g) || "";
    function build_layout() {
        if (grid) {
            if (w.Packery) {
                var pckry = new Packery(grid, {
                        itemSelector : h,
                        gutter : 0
                    });
            } else if (w.Masonry) {
                var msnry = new Masonry(grid, {
                        itemSelector : h,
                        columnWidth : k
                    });
            }
        }
    }
    build_layout();
    if (a && disqus_shortname) {
        w.loadJS && loadJS(embed_js_src, function () {
            if (grid) {
                var f = !1;
                setInterval(function () {
                    var disqus_thread_height = a.clientHeight || a.offsetHeight || "";
                    if (108 < disqus_thread_height && !1 === f) {
                        /* alert(disqus_thread_height); */
                        build_layout();
                        f = !0;
                    }
                }, 100);
            }
        });
    }
});