Jquery attr（）がクリック関数内で動作しない

Question

私は3日間、attr（）がJqueryの関数内で動作しない理由を理解しようとしています。質問はすでに答えられているように見えるかもしれませんが、誰も私のために働いていません。

data-textアトリビュートをツイートボタンから現在のテキストにツイートするように変更しようとしています。

ここ

が私のコードです：Jsfiddleで

$(".twitter-share-button").attr("data-text", "Hello World"); //Working 

$("#change").on("click", function() { 
    $(".twitter-share-button").attr("data-text", "Hello Universe"); // Not working 
}); 

例：https://jsfiddle.net/ooneskbe/

Answer 1

あなたの質問は全体像を表すものではありません。これがうまくいかない理由は、次のスクリプトを含むためです。

<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script> 

このスクリプトはHTMLを変更します。スクリプトが含まれていない場合は、ボタンの生成されたHTMLは、しかし

<a class="twitter-share-button" href="https://twitter.com/share" data-show-count="false" data-size="large">Tweet</a> 

あるとすぐに、このスクリプトがロードされ、実行されるよう、あなたのHTMLは

<a class="btn" id="b" href="https://twitter.com/intent/tweet?original_referer=https%3A%2F%2Ffiddle.jshell.net%2F_display%2F&amp;ref_src=twsrc%5Etfw&amp;tw_p=tweetbutton&amp;url=https%3A%2F%2Ffiddle.jshell.net%2F_display%2F"> 
    <i></i> 
    <span class="label" id="l">Tweet</span> 
</a> 

は、あなたが新しいHTMLことを確認することができなりましたクラスはtwitter-share-buttonではありません。私はあなたがデータ属性で達成しようとしていることを確信していませんが、これを行うには他の方法を考える必要があります。

Answer 2

$(".twitter-share-button").attr("data-text", "Hello World"); 
var dataObj = $(".twitter-share-button").data(); 
$("#change").on("click", function() { 
    dataObj.text = "Hello Universe"; 
    $(".twitter-share-button").data(dataObj); 
}); 

それを試してみてください：https://jsfiddle.net/667f171z/1/