Блог

Я искал похожий вопрос, но не смог его найти. Я пытаюсь увеличить количество подписчиков twitter / facebook / rss до a <span>....</span> на моей боковой панели.

Для получения чисел я использую некоторые php-скрипты. В отдельном файле у меня есть javascript и в моем sidebar.php файл, который у меня есть <span>....</span> . Я пытался все отладить, но не могу найти свою ошибку.

На боковой панели я использую:

 <div id="social-bar">

                    <ul>
                        <li class="rss-count"><a href="http://feeds.feedburner.com/dewereldverzamelaar"><span>..........</span></a></li>
                        <li class="twitter-count"><a href="http://twitter.com/deverzamelaar"><span>..........</span></a></li>
                        <li class="facebook-count"><a href="http://www.facebook.com/dewereldverzamelaar"><span>..........</span></a></li>
                    </ul>

                <!--END #social-bar-->
                </div>
  

Мои php-файлы для получения подписчиков в твиттере (например) выглядят так:

 <?php
$screenName = 'deverzamelaar';
$getData = 'followers_count';

$xml = file_get_contents('http://twitter.com/users/show.xml?screen_name=' . $screenName);

if(preg_match('/' . $getData . '>(.*)</', $xml, $count) !=0)
echo "$count[1]";   
?>
  

Наконец, у вас есть скрипт jQuery:

 var count = 0;

jQuery('.rss-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-rss.php', function() {
        count  ;
        tz_showSocial(count);

});
jQuery('.twitter-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-twitter.php', function() {
        count  ;
        tz_showSocial(count);
});
jQuery('.facebook-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-facebook.php', function() {
        count  ;
        tz_showSocial(count);
});

function tz_showSocial(count) {
if(count == 3)
    jQuery('#social-bar').fadeIn(200);
}
  

Я знаю, что скрипты php работают, потому что они отражают нужное количество подписчиков. Я думаю, что jQuery также работает, потому что счетчик достигает 3, и появляется социальная панель div. Но он не будет показывать количество подписчиков, он продолжает показывать ….. .
Я не специалист по php / html или jQuery. Я взял несколько фрагментов и попытался создать что-то из этого.
Почему эхо-сигнал не попадает в <span></span> ? Я надеюсь, что кто-нибудь сможет объяснить и помочь мне.

Приветствую, Джонас Сметс

Здесь отредактированная версия, помните, что она уже есть в «jQuery (document) .ready(function() {» потому что загружается много других скриптов (из темы WordPress):

 var count, loadCallback;

count = 0;
loadCallback = function(response, status, request) {
  // Since you use the same code in all the callbacks, you might as well
  // only declare the function once. Since we're doing that, we might as
  // well merge tz_showSocial into here as well...
  if (request.status != 200) {
    alert('Oh no! Something went wrong with the update! (HTTP ' request.status ')');
  }
  count  ;
  if (count > 2) {
    jQuery('#social-bar').fadeIn(200);
  }
};

// As Dvir Azulay correctly points out, you should execute the AJAX calls
// in the ready event

  jQuery('.rss-count span').load('/includes/update-rss.php', loadCallback);
  jQuery('.twitter-count span').load('/includes/update-twitter.php', loadCallback);
  jQuery('.facebook-count span').load('/includes/update-facebook.php', loadCallback);
  

With this version of the code there is definitely something happening: http://www.developer.dewereldverzamelaar.net
The page loads fine but goes blank? It has something to do with the jQuery script, if I take the script out the page loads fine.

If you need any extra info, please let me know.
Jonas Smets

//////////////////////////////////////////////////
Still not working, this is what I have right now:

     /* here are some variables I've added for my script: */
    var count, loadCallback;

    count = 0;
        /*-----------------------------------------------------------------------------------

            Custom JS - All front-end jQuery

        -----------------------------------------------------------------------------------*/


        /*-----------------------------------------------------------------------------------*/
        /*  Remove JavaScript fallback class
        /*-----------------------------------------------------------------------------------*/

        jQuery('#container').removeClass('js-disabled');

        /*-----------------------------------------------------------------------------------*/
        /*  Let's get ready!
        /*-----------------------------------------------------------------------------------*/

        jQuery(document).ready(function() {
    /* here you get some other scripts the theme uses */

    /* here my script start */
    loadCallback = function(response, status, request) {
      // Since you use the same code in all the callbacks, you might as well
      // only declare the function once. Since we're doing that, we might as
      // well merge tz_showSocial into here as well...
      if (request.status != 200) {
        alert('Oh no! Something went wrong with the update! (HTTP ' request.status ')');
      }
      count  ;
      if (count > 2) {
        jQuery('#social-bar').fadeIn(200);
      }
    };

    // As Dvir Azulay correctly points out, you should execute the AJAX calls
    // in the ready event

      jQuery('.rss-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-rss.php', loadCallback);
  jQuery('.twitter-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-twitter.php', loadCallback);
  jQuery('.facebook-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-facebook.php', loadCallback);


    /* again one other script the theme uses */
    /* at the end this script closes the document.ready  function closes */
  

Прямо сейчас страница все еще перезагружается до пустой. Когда я извлекаю свой код jQuery, все снова работает нормально. Я понятия не имею, что я мог бы сделать, чтобы заставить это работать.

Джонас

Оке, по какой-то причине он работает сейчас. Не знаю, что я изменил. Для людей, задающих один и тот же вопрос, это код jQuery, который работает, я не менял свой php и html-код, они были в порядке с самого начала:

 /* Some Variables outside the document.ready function */
var count, loadCallback;
count = 0;
/*-----------------------------------------------------------------------------------*/
/*  Let's get ready!
/*-----------------------------------------------------------------------------------*/

jQuery(document).ready(function() {


/*-----------------------------------------------------------------------------------*/
/*  Social Count Script
/*-----------------------------------------------------------------------------------*/


loadCallback = function(response, status, request) {
  // Since you use the same code in all the callbacks, you might as well
  // only declare the function once. Since we're doing that, we might as
  // well merge tz_showSocial into here as well...
  if (request.status != 200) {
    alert('Oh no! Something went wrong with the update! (HTTP ' request.status ')');
  }
  count  ;
  if (count > 2) {
    jQuery('#social-bar').fadeIn(200);
  }
};

// As Dvir Azulay correctly points out, you should execute the AJAX calls
// in the ready event

  jQuery('.rss-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-feedburner.php', loadCallback);
  jQuery('.twitter-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-twitter.php', loadCallback);
  jQuery('.facebook-count span').load('http://developer.dewereldverzamelaar.net/wp-content/themes/gridlocked/includes/update-facebook.php', loadCallback);

/* Some other scripts go here, at the end the document.ready function is closed. */
  

Спасибо всем.
Джонас Сметс

Мне кажется, что вы выполняете код jQuery до полной загрузки DOM, и это может включать боковые панели.

Попробуйте поместить весь ваш код jQuery в $(document).ready(function(){ jquery code }); блок.

1. Вы уверены, что эти URL-адреса верны (в коде JS)? Я не могу их загрузить…
2. Страница, с которой вы пытаетесь запустить JS-код, также обслуживается www.dewereldverzamelaar.com ? Потому что, если нет, это абсолютно не сработает из-за той же политики происхождения.

Я думаю, что лучшим способом выяснить, в чем проблема, было бы добавить некоторую обработку ошибок в вашу функцию обратного вызова. Это довольно просто, поскольку jQuery поможет передать объект XMLHttpRequest в обратный вызов в качестве третьего параметра.

Например, вот как я бы написал этот код…

 var count, loadCallback;

count = 0;
loadCallback = function(response, status, request) {
  // Since you use the same code in all the callbacks, you might as well
  // only declare the function once. Since we're doing that, we might as
  // well merge tz_showSocial into here as well...
  if (request.status != 200) {
    alert('Oh no! Something went wrong with the update! (HTTP ' request.status ')');
  }
  count  ;
  if (count > 2) {
    jQuery('#social-bar').fadeIn(200);
  }
};

// As Dvir Azulay correctly points out, you should execute the AJAX calls
// in the ready event
$(document).ready(function() {
  $('.rss-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-rss.php', loadCallback);
  $('.twitter-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-twitter.php', loadCallback);
  $('.facebook-count span').load('http://www.dewereldverzamelaar.com/wp-content/developer/themes/gridlocked/includes/update-facebook.php', loadCallback);
});