Twitter分享按钮动态URL分享

Question

我试图制作一个自定义的Twitter按钮，当点击时会抓取当前页面的页面URL，这显然会根据它出现在哪个页面上而改变，与默认共享按钮不同。但是，我不确定如何将页面URL传递到按钮。

这是我迄今jsfiddle

<style type="text/css" media="screen"> 

</style> 
<div id="social-share-container"> 
<div id="custom-tweet-button"> 
<a id="tweetShare" href="https://twitter.com/share?url="+encodeURIComponent(document.URL); target="_blank">Tweet 
    </a> 
</div> 
</div> 

这是一个有点砍死在一起，我与JS很陌生。

Answer 1

就以document.location看看：
location.hostname
location.pathname
http://www.w3schools.com/jsref/obj_location.asp

Answer 2

我建议window.location的 - 这会给你的当前页面的URL。

问题是你在HTML中使用JS内联 - 你不能像你想要的那样做。

我用一些香草js更新了你的小提琴，向你展示了一个更好的方法来做到这一点。

http://jsfiddle.net/4jF5N/1/

var link = document.getElementById('tweetShare'); 
var url = window.location; 

link.addEventListener('click',function(event){ 
    event.preventDefault(); 

    window.open("https://twitter.com/share?url="+encodeURIComponent(url)); 
    alert(url) 
},false); 

Answer 3

此经过URL和标题与Twitter共享页面简单的弹出框：

<script language="javascript"> 
    function tweetCurrentPage() 
    { window.open("https://twitter.com/share?url="+escape(window.location.href)+"&text="+document.title, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false; } 
</script> 

<a class="tweet" href="javascript:tweetCurrentPage()" target="_blank" alt="Tweet this page">Tweet this page</a> 

如果你不希望它在弹出打开框，你可以用这个来代替window.open：

window.location.href="https://twitter.com/share?url="+escape(window.location.href)+"&text="+document.title;