php - 使用 $.ajax 调用后 Facebook 和 Twitter 共享按钮未出现

标签 php jquery ajax facebook twitter

我正在开发一个简单的脚本，它从 Instagram 获取所有图像。

我对 Facebook 分享按钮有一个非常奇怪的问题。

这是我当前的脚本:

<?PHP
 function callInstagram($url)
    {
    $ch = curl_init();
    curl_setopt_array($ch, array(
    CURLOPT_URL => $url,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_SSL_VERIFYPEER => false,
    CURLOPT_SSL_VERIFYHOST => 2
    ));

    $result = curl_exec($ch);
    curl_close($ch);
    return $result;
    }

    $tag = Mage::getStoreConfig('vivastags/vivasgroup/instagra_tag');
    $tag_additional = Mage::getStoreConfig('vivastags/vivasgroup/instagram_tag');
    $client_id = "1e0f576fbdb44e299924a93cace24507";
    $Next_URL = $_GET["nexturl"];
    if($Next_URL == ""){
    $url = 'https://api.instagram.com/v1/tags/'.$tag.'/media/recent?client_id='.$client_id.'&count=24';
    } else {
    $url =  $Next_URL;
    }

    $Next_URL_Additional = $_GET["nexturl_add"];
    if($Next_URL_Additional == ""){
    $url_add = 'https://api.instagram.com/v1/tags/'.$tag_additional.'/media/recent?client_id='.$client_id.'&count=24';
    } else {
    $url_add =  $Next_URL_Additional;
    }   

    $inst_stream = callInstagram($url);
    $results = json_decode($inst_stream, true);
    $maxid = $results['pagination']['next_max_id'];
    $nexturl = $results['pagination']['next_url'];

    $inst_stream_add = callInstagram($url_add);
    $results_add = json_decode($inst_stream_add, true);
    $maxid_add = $results_add['pagination']['next_max_id'];
    $nexturl_add = $results_add['pagination']['next_url'];  
    //Now parse through the $results array to display your results... 
    ?>
    <div class="holder" style="display:block;margin-left:70px;">
    <?PHP
    foreach($results['data'] as $item){
        $image_link = $item['images']['thumbnail']['url'];
        $big_image = $item['images']['standard_resolution']['url'];
        $Profile_name = $item['user']['username'];
        $PostID = $item['id'];
        $Full_name = $item['user']['full_name'];
        $Profile_Picture = $item['user']['profile_picture'];
        $link = $item['link'];


        $NotParsedString = Mage::getStoreConfig('vivastags/vivasgroup/instagra_forbiden_ids');

        if(!in_array($PostID, explode(",", $NotParsedString))) {

         ?>

        <a class="fancybox" rel="gallery1" href="#<?PHP echo $PostID;?>" id-za-premahvane="<?PHP echo $PostID;?>">
            <img src="<?PHP echo $image_link; ?>" id="InstaBlock"/>
        </a>
            <div id="<?PHP echo $PostID;?>" style="display:none;">
            <img src="<?PHP echo $big_image;?>" style="width:75%;">
            <div style="display:block;clear:both;width:100%;">
            <div style="display:block;width:200px;margin-top:10px;clear:both;margin-left:auto;margin-right:auto;">
                <div style="display:block;">
                    <div class="fb-share-button" data-href="<?PHP echo $link; ?>" data-layout="button"></div>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:100px;">
                    <a href="https://twitter.com/share" class="twitter-share-button" data-url="<?PHP echo $link; ?>" data-via="CosmeoShop">Tweet</a>
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:180px;">
                <a href="https://www.pinterest.com/pin/create/button/
                    ?url=<?PHP echo $link; ?>
                    &media=<?PHP echo $big_image;?>
                    &description=Next%20stop%3A%20Pinterest"
                    data-pin-do="buttonPin"
                    target="_blank">
                    <img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" />
                </a>
                </div>
            </div>
                <div style="display:block;margin-left:auto;margin-right:auto;margin-top:20px;">
                    <a href="<?PHP echo $link; ?>" target="_blank"><img src="<?PHP echo $Profile_Picture;?>" width="50px;"></a> <a href="<?PHP echo $link; ?>" target="_blank"><b>@<?PHP echo $Full_name;?></b></a>

                </div>

            </div>
            </div>

        <?PHP 
        }
    }

    foreach($results_add['data'] as $item_add){
        $image_link_add = $item_add['images']['thumbnail']['url'];
        $big_image_add = $item_add['images']['standard_resolution']['url'];
        $Profile_name_add = $item_add['user']['username'];
        $PostID_add = $item_add['id'];
        $Full_name_add = $item_add['user']['full_name'];
        $Profile_Picture_add = $item_add['user']['profile_picture'];
        $link_add = $item_add['link'];


        $NotParsedString_add = Mage::getStoreConfig('vivastags/vivasgroup/instagra_forbiden_ids');

        if(!in_array($PostID_add, explode(",", $NotParsedString_add))) {

         ?>

        <a class="fancybox" rel="gallery1" href="#<?PHP echo $PostID_add;?>" id-za-premahvane="<?PHP echo $PostID_add;?>">
            <img src="<?PHP echo $image_link_add; ?>" id="InstaBlock"/>
        </a>
            <div id="<?PHP echo $PostID_add;?>" style="display:none;">
            <img src="<?PHP echo $big_image_add;?>" style="width:75%;">
            <div style="display:block;clear:both;width:100%;">
            <div style="display:block;width:200px;margin-top:10px;clear:both;margin-left:auto;margin-right:auto;">
                <div style="display:block;">
                    <div class="fb-share-button" data-href="<?PHP echo $link_add; ?>" data-layout="button"></div>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:100px;">
                    <a href="https://twitter.com/share" class="twitter-share-button" data-url="<?PHP echo $link_add; ?>" data-via="CosmeoShop">Tweet</a>
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:180px;">
                <a href="https://www.pinterest.com/pin/create/button/
                    ?url=<?PHP echo $link_add; ?>
                    &media=<?PHP echo $big_image_add;?>
                    &description=Next%20stop%3A%20Pinterest"
                    data-pin-do="buttonPin"
                    target="_blank">
                    <img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" />
                </a>
                </div>
            </div>
                <div style="display:block;margin-left:auto;margin-right:auto;margin-top:20px;">
                    <a href="<?PHP echo $link_add; ?>" target="_blank"><img src="<?PHP echo $Profile_Picture_add;?>" width="50px;"></a> <a href="<?PHP echo $link_add; ?>" target="_blank"><b>@<?PHP echo $Full_name_add;?></b></a>

                </div>

            </div>
            </div>

        <?PHP 
        }
    }

    ?>  
    <div id="LoadedResults"></div>
    </div>
    <?PHP
    $nextUrlEncoded_add = urlencode($Next_URL_Additional);
    $nextUrlEncoded = urlencode($nexturl);
    ?>
    <div id="Loading">
    Моля, изчакайте...
    </div>

     <script type="text/javascript">


    jQuery(document).ready(function($) {


    $(".fancybox").fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        'titlePosition'     : 'inside',
        'transitionIn'      : 'none',
        'transitionOut'     : 'none'
    }); 

    var NextUrlLink = "";
    var NextUrlLink_add = "";
    var TimesScrolled = 0;

                if (!NextUrlLink){
                    var nextUrl = "<?PHP echo $nexturl;?>";
                }

                if (NextUrlLink){
                    var nextUrl = NextUrlLink;
                }

                if (!NextUrlLink_add){
                    var nextUrl_add = "<?PHP echo $nexturl_add;?>";
                }

                if (NextUrlLink_add){
                    var nextUrl_add = NextUrlLink_add;
                }   

      $(window).scroll(function() {
          if (TimesScrolled < 6) {
              var hT = $('.footer-banners').offset().top,
                   hH = $('.footer-banners').outerHeight(),
                   wH = $(window).height(),
                   wS = $(this).scrollTop();
               if (wS > (hT+hH-wH)){
                $('#Loading').show();

                $.ajax({
                  url: 'getajaxlink.php',
                  type: 'POST',
                  dataType: 'html',
                  data: {
                    next_url: nextUrl
                  },
                }).done(function ( html ) {
                    var data = JSON.parse(html);
                    NextUrlLink = data.next_url_link;
                });

                $.ajax({
                  url: 'getajaxlink_add.php',
                  type: 'POST',
                  dataType: 'html',
                  data: {
                    next_url_add: nextUrl_add
                  },
                }).done(function ( html ) {
                    var datas = JSON.parse(html);
                    NextUrlLink_add = datas.next_url_link;
                });             

                $.ajax({
                  url: 'ajax.php',
                  type: 'POST',
                  dataType: 'html',
                  data: {
                    next_url: nextUrl,
                    next_url_add: nextUrl_add
                  },
                }).done(function ( html ) {
                  TimesScrolled = TimesScrolled + 1;
                  $('#LoadedResults').append( html);
                  $('#Loading').hide();
                });


               }

          } else {
          $('#LoadMore').show();


          }           
    });

                    $( "#LoadMore" ).click(function() {
                $('#Loading').show();   
                    $.ajax({
                  url: 'ajax.php',
                  type: 'POST',
                  dataType: 'html',
                  data: {
                    next_url: nextUrl,
                    next_url_add: nextUrl_add
                  },
                }).done(function ( html ) {
                  TimesScrolled = TimesScrolled + 1;
                  $('#LoadedResults').append( html);
                  $('#Loading').hide();
                });
                });     
    });
  </script>

 <button id="LoadMore">Зареди още..</button>

当用户滚动到具有 footer-banners 类的 div 元素时，此脚本会加载更多内容。它从文件 ajax.php 调用一个 $.ajax 函数，这里是 ajax.php 的完整代码:

<?PHP
    error_reporting(E_ALL | E_STRICT);
    $mageFilename = 'app/Mage.php';
    require_once $mageFilename;
    $app = Mage::app(); 
    Mage::app();

    Mage::getSingleton('core/session', array('name' => 'frontend'));

    ini_set('display_errors', 1);

 function callInstagram($url)
    {
    $ch = curl_init();
    curl_setopt_array($ch, array(
    CURLOPT_URL => $url,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_SSL_VERIFYPEER => false,
    CURLOPT_SSL_VERIFYHOST => 2
    ));

    $result = curl_exec($ch);
    curl_close($ch);
    return $result;
    }


    $client_id = "1e0f576fbdb44e299924a93cace24507";
    $Next_URL = $_POST["next_url"];
    $url =  $Next_URL;

    $Next_URL_add = $_POST["next_url_add"];
    $url_add =  $Next_URL_add;

    $inst_stream = callInstagram($url);
    $results = json_decode($inst_stream, true);
    $maxid = $results['pagination']['next_max_id'];
    $nexturl = $results['pagination']['next_url'];
    //Now parse through the $results array to display your results... 
    foreach($results['data'] as $item){
        $image_link = $item['images']['thumbnail']['url'];
        $big_image = $item['images']['standard_resolution']['url'];
        $Profile_name = $item['user']['username'];
        $PostID = $item['id'];
        $Full_name = $item['user']['full_name'];
        $Profile_Picture = $item['user']['profile_picture'];
        $link = $item['link'];


        $NotParsedString = Mage::getStoreConfig('vivastags/vivasgroup/instagra_forbiden_ids');

        if(!in_array($PostID, explode(",", $NotParsedString))) {

         ?>

        <a class="fancybox" rel="gallery1" href="#<?PHP echo $PostID;?>" id-za-premahvane="<?PHP echo $PostID;?>">
            <img src="<?PHP echo $image_link; ?>" id="InstaBlock"/>
        </a>
            <div id="<?PHP echo $PostID;?>" style="display:none;">
            <img src="<?PHP echo $big_image;?>" style="width:75%;">
            <div style="display:block;clear:both;width:100%;">
            <div style="display:block;width:200px;margin-top:10px;clear:both;margin-left:auto;margin-right:auto;">
                <div style="display:block;">
                    <div class="fb-share-button" data-href="<?PHP echo $link; ?>" data-layout="button"></div>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:100px;">
                    <a href="https://twitter.com/share" class="twitter-share-button" data-url="<?PHP echo $link; ?>" data-via="CosmeoShop">Tweet</a>
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:180px;">
                <a href="https://www.pinterest.com/pin/create/button/
                    ?url=<?PHP echo $link; ?>
                    &media=<?PHP echo $big_image;?>
                    &description=Next%20stop%3A%20Pinterest"
                    data-pin-do="buttonPin"
                    target="_blank">
                    <img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" />
                </a>
                </div>
            </div>
                <div style="display:block;margin-left:auto;margin-right:auto;margin-top:20px;">
                    <a href="<?PHP echo $link; ?>" target="_blank"><img src="<?PHP echo $Profile_Picture;?>" width="50px;"></a> <a href="<?PHP echo $link; ?>" target="_blank"><b>@<?PHP echo $Full_name;?></b></a>

                </div>

            </div>
            </div>

        <?PHP 
        }
    }

    $inst_stream_add = callInstagram($url_add);
    $results_add = json_decode($inst_stream_add, true);
    $maxid_add = $results_add['pagination']['next_max_id'];
    $nexturl_add = $results_add['pagination']['next_url'];
    //Now parse through the $results array to display your results... 
    foreach($results_add['data'] as $item_add){
        $image_link_add = $item_add['images']['thumbnail']['url'];
        $big_image_add = $item_add['images']['standard_resolution']['url'];
        $Profile_name_add = $item_add['user']['username'];
        $PostID_add = $item_add['id'];
        $Full_name_add = $item_add['user']['full_name'];
        $Profile_Picture_add = $item_add['user']['profile_picture'];
        $link_add = $item_add['link'];


        $NotParsedString = Mage::getStoreConfig('vivastags/vivasgroup/instagra_forbiden_ids');

        if(!in_array($PostID_add, explode(",", $NotParsedString_add))) {

         ?>

        <a class="fancybox" rel="gallery1" href="#<?PHP echo $PostID_add;?>" id-za-premahvane="<?PHP echo $PostID_add;?>">
            <img src="<?PHP echo $image_link_add; ?>" id="InstaBlock"/>
        </a>
            <div id="<?PHP echo $PostID_add;?>" style="display:none;">
            <img src="<?PHP echo $big_image_add;?>" style="width:75%;">
            <div style="display:block;clear:both;width:100%;">
            <div style="display:block;width:200px;margin-top:10px;clear:both;margin-left:auto;margin-right:auto;">
                <div style="display:block;">
                    <div class="fb-share-button" data-href="<?PHP echo $link_add; ?>" data-layout="button"></div>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:100px;">
                    <a href="https://twitter.com/share" class="twitter-share-button" data-url="<?PHP echo $link_add; ?>" data-via="CosmeoShop">Tweet</a>
                    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
                </div>
                <div style="display:block;position:absolute;margin-top:-20px;margin-left:180px;">
                <a href="https://www.pinterest.com/pin/create/button/
                    ?url=<?PHP echo $link_add; ?>
                    &media=<?PHP echo $big_image_add;?>
                    &description=Next%20stop%3A%20Pinterest"
                    data-pin-do="buttonPin"
                    target="_blank">
                    <img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" />
                </a>
                </div>
            </div>
                <div style="display:block;margin-left:auto;margin-right:auto;margin-top:20px;">
                    <a href="<?PHP echo $link_add; ?>" target="_blank"><img src="<?PHP echo $Profile_Picture_add;?>" width="50px;"></a> <a href="<?PHP echo $link_add; ?>" target="_blank"><b>@<?PHP echo $Full_name_add;?></b></a>

                </div>

            </div>
            </div>

        <?PHP 
        }
    }

我有一个很奇怪的问题。我对两个文件(main 和 ajax.php)使用相同的代码。当使用 ajax.php 加载元素时，Facebook 和 Twitter 按钮未按预期显示。

请观看现场演示:http://home.cosmeosp.eu/social 滚动到底部并加载新内容，然后单击随机图片并查看 Twitter 按钮，因为 Facebook 按钮甚至没有出现。我该如何解决这个问题，问题出在哪里？

你能帮帮我吗？

提前致谢!

最佳答案

ajax调用完成后，调用这个函数:FB.XFBML.parse();

例如:

... ajax call
}).done(function(data){
    // do something 
    FB.XFBML.parse();
});

对于推特:

twttr.widgets.load()

关于php - 使用 $.ajax 调用后 Facebook 和 Twitter 共享按钮未出现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30003671/

上一篇：php - 代码点火器 : Routing URL on Codeigniter

下一篇：php - 如何在 userpro 插件中通过 url wordpress 获取用户标识？

相关文章：

javascript - Uncaught ReferenceError : testString is not defined

PHP 从多个表中选择

php - 在 HTML Select Tag 中使用数据库输出和 PHP

php - 在 PHP 中查找两个日期之间的差异

javascript - Angular.js即ajax请求问题

php - 通过 Ajax 将 Javascript 对象发送到 PHP

javascript - 如何将变量设置为外部内容？

jquery - 如何检查 HTML 表单验证是否通过并触发事件

javascript - 更改 iframe url 更改父窗口 url 阻止了具有来源的框架

javascript - 我可以使用 XMLHttpRequest 写入文件吗

©2024 IT工具网  联系我们