問題描述
這個問題與我所追求的非常接近:用 Jquery 替換 Tweet 按鈕中的屬性
This question comes very closely to what I'm after: Replace an Attribute in the Tweet Button with Jquery
但是，建議的解決方案 只工作一次.也就是說，我不能像這樣在我的 switch 語句中使用它:
However, the suggested solution works just once. That is, I cannot use it in my switch statement like this:
switch(element.id)
{
case "t1":
$(document).ready(function(){
$('a[data-text]').each(function(){
$(this).attr('data-text', Text_Variant_1);
});
$.getScript('http://platform.twitter.com/widgets.js');
});
break;
case "t2":
$(document).ready(function(){
$('a[data-text]').each(function(){
$(this).attr('data-text', Text_Variant_2);
});
$.getScript('http://platform.twitter.com/widgets.js');
});
...
}
發生的情況是 data-text 屬性是根據先發生的情況設置的，之后不會更改.
What happens is that the data-text attribute is set according to whichever case happens first and doesn't change afterwards.
如何根據需要多次更改推文按鈕的 data-text 屬性?
How can I change data-text attribute of a Tweet Button as many times as I need?
更新:這是我正在處理的頁面:http://zhilkin.com/socio/en/
Update: here's the page I'm working on: http://zhilkin.com/socio/en/
Traits 表可以安全地忽略.我想對 Sociotypes 表做的是，當你點擊一個類型時，右側描述下方的 Tweet Button 的 data-text 應該相應更改.
The Traits table can be safely ignored. What I want to do with the Sociotypes table is that when you click on a type, the data-text of the Tweet Button below the description on the right should be changed accordingly.
現在它的工作原理是這樣的:如果我將鼠標懸停在或單擊堂吉訶德"，那么 data-text 將設置為...堂吉訶德 ..."，并且它保持如果我稍后單擊Dumas"，則相同.反之亦然:如果我將鼠標懸停在或單擊Dumas"，則 data-text 將設置為... Dumas ..."，并且在單擊Don Quixote"時不會更改.(其他類型暫時為空.)
Right now it works like this: if I hover on or click "Don Quixote", then data-text is set to "... Don Quixote ...", and it stays the same if I click "Dumas" later. And vice versa: if I hover on or click "Dumas", then data-text is set to "... Dumas ..." and doesn't change if I click "Don Quixote". (Other types are empty at the moment.)
因此，Tweet Button 僅在我第一次運行腳本時更改，但我需要根據類型更改多次更新它.
So, the Tweet Button is only changed the first time I run the script, but I need it to be updated as many times as the type changes.
推薦答案
今天早上我為此苦苦掙扎了幾個小時，但終于成功了！問題本質上是您只能在頁面中包含 twitter widgets.js 腳本 once，并且該腳本會評估 data-text 屬性負載.因此，在您的示例中，您在加載腳本之前動態設置 data-text 屬性 ，這將按預期工作.但是，由于腳本已經運行，因此您無法再進行更新.
I struggled with this for a couple of hours this morning, but finally got it working! The problem is essentially that you can only include the twitter widgets.js script once in the page, and that script evaluates the data-text attribute on load. Therefore, in your example, you dynamically set the data-text attribute before loading the script, which will work as expected. However, you can then make no further updates as the script has already run.
我看到這篇文章建議你可以調用twttr.widgets.load() 在運行時再次重新評估和重新渲染按鈕，但這對我不起作用.這是因為該函數重新評估 <a> 標簽，而不是 <iframe> 標簽！
I saw this article suggesting you can call twttr.widgets.load() again at runtime to re-evaluate and re-render the buttons, however that didn't work for me. This is because that function re-evaluates <a> tags, not <iframe> tags!
因此，正如 此處指出，解決方案是從 DOM 中完全移除渲染的 <iframe>，然后在調用 twttr.widgets.load 之前創建一個具有所有適當屬性的新 元素() 最終重新評估它并把它變成一個 <iframe>.
So the solution, as pointed out here, is to completely remove the rendered <iframe> from the DOM, then make a new <a> element with all the appropriate attributes before calling twttr.widgets.load() to finally re-evaluate it and turn it into an <iframe>.
請參閱 this fiddle 了解工作示例！
Please see this fiddle for a working example!
這篇關于動態更改推文按鈕“數據文本"內容的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！