更新数据库，无需使用超链接刷新页面。

How can i create something similar to the Facebook LIKE hyperlink which allows me to update mysql database without refreshing the page? In other words , I need this hyperlink to update the database once i click it and display how many likes is stored in DB without page refresh. Thanks in advace.

如何创建类似于Facebook的超链接，使我无需刷新页面就可以更新mysql数据库?换句话说，我需要这个超链接来更新数据库，一旦我点击它，并显示有多少个赞被存储在数据库中，没有页面刷新。谢谢以防。

4 个解决方案

#1

I'd suggest the AJAX approach but just to mention it, the effect could be achieved without AJAX by placing the button in an iframe, this iframe could then follow the the link without the page having to refresh.

我建议使用AJAX方法，但需要指出的是，如果不使用AJAX，只需将按钮放在iframe中，这个iframe就可以跟随链接，而无需刷新页面。

#2

In plain simple words, you will need to use AJAX, which will get fired when you click the hyperlink, using JavaScript.

简单地说，您将需要使用AJAX，当您使用JavaScript单击超链接时，它将被触发。

There are these options to use AJAX:-

使用AJAX有以下选项:-

Use JavaScript own functions to fire AJAX.
使用JavaScript自己的函数来触发AJAX。
Use JavaScript libraries, like jQuery, Prototype, and some more.
使用JavaScript库，如jQuery、Prototype等。

By far, jQuery will suit every novice to its best & you can have a look in here for more details on AJAX.

到目前为止，jQuery将最适合初学者&您可以在这里了解更多关于AJAX的细节。

Hope it helps.

希望它可以帮助。

#3

in even simpler words than my predecessor;

用比我的前任更简单的话来说;

this is what you have

这就是你所拥有的

//html
a href='somewhereOverTheRainbow'>LikeThis...

this is what you should have

这是你应该拥有的

//javascript
var likeIt=function(myAnchorElem){
    //send info to ajax via Zepto, jQuery, Mootools, Dojo, ExtJS - you name it - or a standalone ajax lib
    jQuery.get("somewhere.overtherainbow.com/like.php?url="+myAnchorElem.url);

    //prevent the default
    return false;
}

//html
a href='somewhereOverTheRainbow' onclick='return likeIt(this)'>LikeThis...

@javascriptWizards; I know, he should use addEventListener instead to then get a real event on which he can call preventDefault and more.

@javascriptWizards;我知道，他应该使用addEventListener而不是获取一个真正的事件，在这个事件上他可以调用preventDefault等等。

next to the ajax way, you could use json-p, an img or an iframe or even by using websockets. But for simplicity and ease, stick with the ajax way!

除了ajax方式之外，还可以使用json-p、img或iframe，甚至可以使用websockets。但是为了简单和轻松，请坚持使用ajax方式!

in general; making a feature such as the facebook like or google "+1" seams very trivial. The truth is far from it; it is one of the harder things to do in the web! The Frontend for it is easy like cake. But the Backend... wanting your website to scale and demanding/needing normal database respond times will bring you on to your knees

一般来说;制作像facebook这样的功能或者谷歌“+1”的接缝非常琐碎。事实远非如此;这是网络上最难做的事情之一!它的正面像蛋糕一样容易。但后端…想要你的网站规模和要求/需要正常的数据库响应时间将使你的膝盖

#4

http://infrequently.org/07/OSCON/sample_code.pdf

http://webdeveloper.econsultant.com/ajax-demos-examples-code-samples/

Some code sample

一些代码示例

#1