如何为我的网站制作像“Digg it”这样的按钮?

时间:2022-10-19 22:33:02

I've got a blogging site hosted on Windows Sever, ASP.Net 3.5, ASP.Net AJAX, SQL Server in background.

我有一个博客网站托管在Windows Sever,ASP.Net 3.5,ASP.Net AJAX,SQL Server的后台。

I want to give bloggers a button like 'digg-it' which they can put on their blogs for the readers to click to thumb-up the post if they like it.

我想给博主们一个像'digg-it'这样的按钮,他们可以将这些按钮放在他们的博客上,供读者点击这些帖子,如果他们喜欢的话。

I know I'll be using Javascript to do that. What can I do to: -

我知道我将使用Javascript来做到这一点。我能做些什么: -

  1. Retrieve code from my website which will display the current count of the thumb-up.
  2. 从我的网站检索代码,该代码将显示拇指向上的当前计数。

  3. Increase the count on my website if the user thumbs up something.
  4. 如果用户竖起大拇指,请增加我网站的点数。

Since most of these blogs are on blogger.com/wordpress.com, the plugin code will be embedded in the blog theme. I guess I will be using the URL of the blog post as the unique id. My problem is how to get my site and javascript that's on blogger.com talking.

由于大多数博客都在blogger.com/wordpress.com上,因此插件代码将嵌入到博客主题中。我想我将使用博客帖子的URL作为唯一ID。我的问题是如何让我的网站和javascript在blogger.com上谈论。

Your help will be appreciated.

我们将不胜感激。

Thanks

3 个解决方案

#1


You can look into using SCRIPT callbacks loading JSON data instead of using XmlHttpRequest to get around the crossdomain issues.

您可以考虑使用加载JSON数据的SCRIPT回调,而不是使用XmlHttpRequest来解决跨域问题。

function dynScript(url){
    var script=document.createElement('script');
    script.src=url;
    script.type="text/javascript";
    document.getElementsByTagName('head')[0].appendChild(script);
}
function handleYourData(json) {
    // Do something with your response data if you need to, like alter
    // dom.
}
function thumbUp(postId) {
    dynScript('http://yourdomain.com/path/to/thumbHandler?callback=handleYourData&thumbs=up&postId=' + postId);
}
function thumbDown(postId) {
    dynScript('http://yourdomain.com/path/to/thumbHandler?callback=handleYourData&thumbs=down&postId=' + postId);
}

You can use it like this in your HTML.

您可以在HTML中使用它。

<a onClick="thumbUp(521);">Thumb up</a> | <a onClick="thumbDown(521);">Thumb Down</a>

Your thumbHandler code would have to output JSON with handleYourData() wrapped around it so that your callback will be called with the JSON data as the argument.

你的thumbHandler代码必须输出带有handleYourData()的JSON,以便以JSON数据作为参数调用你的回调。

#2


Try this one. I found it on Yahoo! Search because I knew, there was a German version of this script:

试试这个。我在Yahoo!上找到了它搜索,因为我知道,这个脚本有一个德语版本:

English version: http://www.socialbookmarkscript.com/

英文版:http://www.socialbookmarkscript.com/

German script: http://www.social-bookmark-script.de/

德语脚本:http://www.social-bookmark-script.de/

Good luck!

#3


Okay, I got one answer and while I was trying that method I found something easier.

好的,我得到了一个答案,当我尝试这种方法时,我发现了一些更容易的东西。

What I am going to use is an iframe. An iframe is like a browser window within the browser. The code I render in the iframe will internally access my website as if it's a regular webpage request. So I can use my web services, my background ASP.Net code, and generally everything I want without worrying about messing up the host website.

我要使用的是iframe。 iframe就像浏览器中的浏览器窗口。我在iframe中呈现的代码将在内部访问我的网站,就像它是一个常规的网页请求一样。所以我可以使用我的网络服务,我的后台ASP.Net代码,以及我想要的一切,而不用担心弄乱主机网站。

When I am done developing, I'll post some code here. Meanwhile if you guys know of any pitfall in this approach please tell me.

当我完成开发时,我会在这里发布一些代码。同时,如果你们知道这种方法有任何陷阱,请告诉我。

Here's some sample iframe code that I wrote

这是我写的一些示例iframe代码

<script type="text/javascript">
    window.onload = function() {
        alert("http://mysite.com?url=" + window.location.href);
        document.all.blogvaniframe.src = "http://blogvani.com";
    }
</script>
<iframe id="blogvaniframe" height="100" width="100" scrolling="no" frameborder="0">

</iframe>

I am using javascript to load the content in the iframe because I want to pass an argument to the url's querystring (haven't tested this yet though.

我正在使用javascript加载iframe中的内容,因为我想将一个参数传递给url的查询字符串(尽管还没有测试过。

Thanks

#1


You can look into using SCRIPT callbacks loading JSON data instead of using XmlHttpRequest to get around the crossdomain issues.

您可以考虑使用加载JSON数据的SCRIPT回调,而不是使用XmlHttpRequest来解决跨域问题。

function dynScript(url){
    var script=document.createElement('script');
    script.src=url;
    script.type="text/javascript";
    document.getElementsByTagName('head')[0].appendChild(script);
}
function handleYourData(json) {
    // Do something with your response data if you need to, like alter
    // dom.
}
function thumbUp(postId) {
    dynScript('http://yourdomain.com/path/to/thumbHandler?callback=handleYourData&thumbs=up&postId=' + postId);
}
function thumbDown(postId) {
    dynScript('http://yourdomain.com/path/to/thumbHandler?callback=handleYourData&thumbs=down&postId=' + postId);
}

You can use it like this in your HTML.

您可以在HTML中使用它。

<a onClick="thumbUp(521);">Thumb up</a> | <a onClick="thumbDown(521);">Thumb Down</a>

Your thumbHandler code would have to output JSON with handleYourData() wrapped around it so that your callback will be called with the JSON data as the argument.

你的thumbHandler代码必须输出带有handleYourData()的JSON,以便以JSON数据作为参数调用你的回调。

#2


Try this one. I found it on Yahoo! Search because I knew, there was a German version of this script:

试试这个。我在Yahoo!上找到了它搜索,因为我知道,这个脚本有一个德语版本:

English version: http://www.socialbookmarkscript.com/

英文版:http://www.socialbookmarkscript.com/

German script: http://www.social-bookmark-script.de/

德语脚本:http://www.social-bookmark-script.de/

Good luck!

#3


Okay, I got one answer and while I was trying that method I found something easier.

好的,我得到了一个答案,当我尝试这种方法时,我发现了一些更容易的东西。

What I am going to use is an iframe. An iframe is like a browser window within the browser. The code I render in the iframe will internally access my website as if it's a regular webpage request. So I can use my web services, my background ASP.Net code, and generally everything I want without worrying about messing up the host website.

我要使用的是iframe。 iframe就像浏览器中的浏览器窗口。我在iframe中呈现的代码将在内部访问我的网站,就像它是一个常规的网页请求一样。所以我可以使用我的网络服务,我的后台ASP.Net代码,以及我想要的一切,而不用担心弄乱主机网站。

When I am done developing, I'll post some code here. Meanwhile if you guys know of any pitfall in this approach please tell me.

当我完成开发时,我会在这里发布一些代码。同时,如果你们知道这种方法有任何陷阱,请告诉我。

Here's some sample iframe code that I wrote

这是我写的一些示例iframe代码

<script type="text/javascript">
    window.onload = function() {
        alert("http://mysite.com?url=" + window.location.href);
        document.all.blogvaniframe.src = "http://blogvani.com";
    }
</script>
<iframe id="blogvaniframe" height="100" width="100" scrolling="no" frameborder="0">

</iframe>

I am using javascript to load the content in the iframe because I want to pass an argument to the url's querystring (haven't tested this yet though.

我正在使用javascript加载iframe中的内容,因为我想将一个参数传递给url的查询字符串(尽管还没有测试过。

Thanks