下面是一个显示推文按钮的表单上的功能代码——该按钮位于显示多个图像的表单上——当用户单击其中一个图像时,它会成为“选定”图像,并且推文按钮应该发布推文所选图像的名称和网址:
<a id="tweetBtnId" href="https://twitter.com/share" class="twitter-share-button"
data-text="Check me out on OurWebSite!"
data-url=http://$ourSiteURL
data-via=http://$ourSiteURL data-size="medium" data-count="none">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];
if(!d.getElementById(id)){js=d.createElement(s); js.id=id;
js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js,fjs);}}
(document,"script", "twitter-wjs");</script>
我有一个用于显示图像的 div 的“onclick()”处理程序。当用户单击其中一张图像时,将调用其 div 的 onclick() 处理程序,并将该图像设置为页面上的“currentlySelectedImage”,然后 onclick() 处理程序需要更新 Tweet 按钮的“数据文本”属性与刚刚选择的图像的名称:
// This is part of the code of the 'onclick()' handler for
// the image being selected.
<script>
function handleImageOnClick()
{
var myDynamicTweetText = "name of currently-selected image goes here";
var elem = document.getElementById("tweetBtnId");
alert("The elem is: " + elem); // elem IS NULL !! Dagnabbit.
// this fails because 'elem' is null
elem.setAttribute("data-text", myDynamicTweetText);
// other onclick() code not shown for brevity......
}
</script>
我需要动态地将推文按钮中的“数据文本”属性值更改为所选图像的名称。我添加了上面失败的 javascript 代码——从此处的代码获得的“elem”:
var elem = document.getElementById("tweetBtnId");
为 null(我认为)是因为上面 Twitter 推文按钮代码中的这一行:
if(!d.getElementById(id)){js=d.createElement(s); js.id=id;
我不确定,但看起来 Twitter 推文按钮默认脚本会覆盖任何尝试
向 Tweet 按钮添加“id”属性。
你会看到我添加了id=“tweetBtnId”到上面的推文按钮,这样我就可以访问上面的图像选择 onclick() 处理程序中的推文按钮,然后设置'数据文本'到刚刚选择的图像的名称。
我只是怀疑 Twitter 对“推文”按钮的设计目标是“我们要让这个笨蛋变得愚蠢,我们只会让这些动物选择一个数据文本值 - 每个推文按钮都必须有一个硬编码,“一旦-on-the-page”数据文本属性 - 如果他们尝试动态更改推文按钮的数据文本属性,他们就会笑话他们。”
我需要让它发挥作用——有什么想法吗?