我想在使用jQuery(或ajax)单击图像时运行PHP代码

时间:2012-01-11 17:22:13

标签: php facebook

单击图像时,我有以下代码显示对话框。而不是运行FB.ui我想运行PHP代码。这是为facebook。

<html>
<head>
    <style> img#share_button { cursor: pointer; } </style>
</head>
<body>

<div id="fb-root"></div>

<script>
window.fbAsyncInit = function() {
FB.init({
    appId  : 'xxx',
    status : true, // check login status
    cookie : true, // enable cookies to allow the server to access the session
    xfbml  : true  // parse XFBML
});
};

(function() {
    var e = document.createElement('script');
    e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
    e.async = true;
    document.getElementById('fb-root').appendChild(e);
}());
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

这是图片:

<img id = "share_button" src = "img.png">

这是我需要改变的代码:

<script type="text/javascript">
$(document).ready(function(){
    $('#share_button').live('click', function(e){
        e.preventDefault();
        FB.ui({
            method: 'feed',
            name: 'TabPress1',
            link: 'http://www.hyperarts.com/',
            picture: 'http://www.hyperarts.com/',
            caption: 'I am a fan of TabPress',
            description: 'TabPress -- Gotta love it!',
            message: ''
        });
    });
});
</script>

</body>
</html>

我不知道任何JS,希望你能帮助我!

6 个答案:

答案 0 :(得分:0)

为什么不使用href属性删除链接的底层和颜色并启动php脚本?

答案 1 :(得分:0)

在单击按钮时运行javascript函数:

<img id = "share_button" src = "img.png" onclick = "dothis()">

这里有一些基本的javascript:

<script type = "text/javascript">
function dothis(){
alert("Button pressed");
}
</script>

这只是一些基本的javascript,当点击按钮时会在屏幕上显示消息

编辑:您似乎想要使用JSON。看看这个: http://ditio.net/2008/07/17/php-json-and-javascript-usage/

答案 2 :(得分:0)

因为你已经有jQuery:发送一个AJAX请求:

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
    $('#share_button').live('click', function(e) {
        e.preventDefault();
        $.ajax('/path/to/your/script.php');
    });
});
//]]>
</script>

比照jQuery文档以获取更多信息:http://api.jquery.com/jQuery.ajax/

此外,我添加了CDATA-Tags以避免HTML-Special-Chars出现问题。通常必须对这些特殊字符进行编码。

答案 3 :(得分:0)

FB.ui(param1,param2)方法可以采用两个参数。您已指定了第一个指示Feed对话框显示方式。 Param2可以是你的回调函数

FB.ui(
  {
    method: 'feed',
    name: 'Facebook Dialogs',
    link: 'http://developers.facebook.com/docs/reference/dialogs/',
    picture: 'http://fbrell.com/f8.jpg',
    caption: 'Reference Documentation',
    description: 'Dialogs provide a simple, consistent interface for applications to interface with users.'
  },
  function(response) {
    if (response && response.post_id) {
      alert('Post was published.');
    } else {
      alert('Post was not published.');
    }
  }
);

post was published的代码切换中,您可以使用jQuery对您的某个PHP页面进行AJAX调用。请参阅:http://api.jquery.com/jQuery.ajax/

答案 4 :(得分:0)

如果您不知道任何javascript,也许最好是查看一些初学者教程,例如http://net.tutsplus.com/category/tutorials/javascript-ajax/?tag=basix的教程,但是关于您的问题......

看起来你正在使用jQuery。执行描述的最佳方式是使用AJAX,jQuery具有很好的功能。

要根据jQuery中的ID从DOM中选择一个元素,只需执行以下操作:

$("#TheIdOfYourImage")

现在,要听取它被点击的时间,

$("#TheIdOfYourImage").click(function(){
   //DO SOMETHING
}

现在,为AJAX带来乐趣。您可以在http://api.jquery.com/category/ajax/阅读文档以获取更多技术细节,但这可以归结为

        $("#TheIdOfYourImage").click(function(){
            $.ajax({
              type: "POST",                                 // If you want to send information to the PHP file your calling, do you want it to be POST or GET. Just get rid of this if your not sending data to the file
              url: "some.php",                             // The location of the PHP file your calling
              data: "name=John&location=Boston",           // The information your passing in the variable1=value1&variable2=value2 pattern
              success: function(result){ alert(result) }   // When you get the information, what to do with it. In this case, an alert
            });
        }

答案 5 :(得分:0)

根据你的评论,我想你想做这样的事情:

$(document).ready(function(){
    // on click
    $('#share_button').live('click', function(e){
        e.preventDefault();

        // any parameters you need to pass to your php script, 
        // you can omit the data parameter if you don't need it
        var data = { param1: "a", param2: 2 }; 

        // start the ajax request
        $.post("your/script.php", data, function() {

            // when the ajax request completes, show the FB dialog
            FB.ui({
                method: 'feed',
                name: 'TabPress1',
                link: 'http://www.hyperarts.com/',
                picture: 'http://www.hyperarts.com/',
                caption: 'I am a fan of TabPress',
                description: 'TabPress -- Gotta love it!',
                message: ''
            });
        });
    });
});

相关的javascript引用: