2016-08-22 15 views
0

Disqusの経験がある人はいますか? 既存のウェブサイトにボタンを追加しています。ボタンを押すと、disqusコメントが表示されます。初めにボタンをクリックしたときにDisqusが発砲しない

が、これはそう

var button = document.createElement("a"); 
    button.setAttribute("id", "diqus"); 
    button.innerHTML = "Discussion"; 
    button.addEventListener('click', loaddisqus); 

function loaddisqus(e){ 
    parent_element = $(this).parent().parent(); 
    next_element = parent_element.next(); 
    subjectcode = next_element.attr('data-subjectcode'); 

    var disqus_identifier = subjectcode; 
    var disqus_url = window.location.origin; 
    next_element.after('<div id="disqus_thread"></div>'); 

、その後、

function insertdisqus(){ 
    var dsq = document.createElement('script'); 
    dsq.type = 'text/javascript'; 
    dsq.async = true; 
    dsq.src = 'https://myforum.disqus.com/embed.js'; 
    $('head').append(dsq); 

}

を実行しているボタンを押すと、loaddisqusは実行する必要があり、そしてそれはありません。しかし、それはdisqus_thread divを作成する以上に何もしません... 何が間違っている可能性がありますか?

答えて

0

まず最初に、あなたは(ない良いアイデア)無地のJavaScriptとjQueryをミックスしてみてください

おそらくあなたは、このような何かを試すことができます。

var btn = $('<button>').html('Duscussion').on('click', btnClickListener); 
$('body').append(btn); 

var btnClickListener = function(event){ 
    var clickedElement = $(this); // get the clicked element 
    clickedElement.html('new Text'); // do what you want (i.e. change the content of the clicked button) 
} 

二つ目は、あなたが(リンクを使用しようと、ありますa-tag)をボタンとして表示します。問題は、リンクが常にあなたのページをhrefターゲットに再配置しようとしていることです。ボタンはリンクではなくボタンでなければなりません。あなたがあるため、スタイルや何かのリンクが必要な場合には、このような何かにあなたのリスナー関数を消費する必要があります。

var linkButton = $('<a>').attr('href', '#').html('click here').on('click', linkButtonListener); 
$('body').append(linkButton); 

var linkButtonListener = function(event){ 
    event.stopPropagation(); // stops actions from all parent elements 
    event.preventDefault(); // stops the default actions of the link 
    var clickedButton = $(this); // get the clicked element 
    clickedButton.html('allready clicked'); // do what you want (i.e. change the content of the link) 
} 

私はそれはあなたがjQueryを使ってリスナーが非常にシンプルな仕組みを理解するのに役立ちます願っています。

最後に、スクリプトタグを有効にして、ボタンをクリックした後にスクリプトが実行されるようにしてください。これはjavascriptでは機能しません。すべてのスクリプトは一度ロードされます。ドキュメントの準備ができたらスクリプトタグを追加して実行することはできません。これを望むなら、(おそらくeval関数を使って)手で実行する必要がありますが、それは良い方法ではありません。アクションによってスクリプトを含み、実行可能にすることができるいくつかのフレームワークがあります。私はそれが動作しないとそれを使用していない知っている。

+0

私はコードを書いていたので、私は本当に正しいと思います。なぜなら、私はjavascriptには本当に新しいので、私は同じ感じでした....しかし、私はポイントが、私は何か間違っていると思いますむしろDisqusのエンドポイントです。なぜなら、コードは醜く正しいフォーマットではないかもしれませんが、私はチェックしてデバッグしても適切なタイミングでスクリプトが動作するからです。ちょうどそのDisqusは、追加されたdivタグを探して、自動的にそのコメントをロードする必要があります... – PowerLove