Laden Sie twitter-widget von ajax-geladenen html?

Ich versuche, eine ziemlich standard-twitter-such-widget, die direkt von der twitter-Seite:

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'search',
  search: '$AAPL',
  interval: 6000,
  title: 'AAPL',
  subject: '',
  width: 250,
  height: 300,
  theme: {
    shell: {
      background: '#8ec1da',
      color: '#ffffff'
    },
    tweets: {
      background: '#ffffff',
      color: '#444444',
      links: '#1985b5'
    }
  },
  features: {
    scrollbar: false,
    loop: true,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    toptweets: true,
    behavior: 'default'
  }
}).render().start();
</script>

Und es ist immer geladen, etwa so:

$(".linktosymbol").bind("ajax:success", function(event, data, status, xhr) {
    $(".symboldetails").html("");
    var target = $("#" + $(this).attr('data-target'));
    target.html(data);
});

Erscheint es nie, obwohl, scheint es nur einen leeren Bildschirm und gehen Sie auf das laden ewig. Ideen?

haben Sie versucht, das Lesen der Parameter "data", "status" und "xhr", was sagen Sie. Wenn Sie chrome verwenden, können Sie diese in der Konsole. console.log(data);console.log(status);console.log(xhr);
Ja, die sind alle ok. Es gibt die HTML-Prima - es ist, wenn es läuft die twitter-javascript, dass die Dinge gehen drunter und drüber.

InformationsquelleAutor David N. Welton | 2011-01-31

Hatte das gleiche Problem. Das problem ist, dass die Twitter-JS erzeugt das markup mit document.write, die nur funktioniert, wenn das Dokument generiert wird. Sonst wird es ein neues Dokument erstellen.

Tipp: Beim Debuggen, ist es einfacher, den original-code an http://twitter.com/javascripts/widgets/widget.js.

<div id="twtr-widget"></div>
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 6000,
  width: 500,
  height: 300,
  id: 'twtr-widget',
  theme: {
    shell: {
      background: '#333333',
      color: '#ffffff'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('Znarkus').start();
</script>

Dass ist meine Lösung. Fügen Sie die id parameter, und Twitter wird das markup für das element mit der entsprechenden id (das ist, was die top - div ist für).

Anmerkung: ich hatte Probleme mit der minified-version der Schrift, so habe ich http://twitter.com/javascripts/widgets/widget.js statt.

InformationsquelleAutor Znarkus

$('#Twitter').click(function (e) {
  $.getScript
    (
      "http://widgets.twimg.com/j/2/widget.js",
      function () {
         makeTwitterWidget();
       }
     ); 
});

function makeTwitterWidget() {
new TWTR.Widget
    (
        {
            version: 2,
            type: 'profile',
            rpp: 3,
            interval: 3000,
            width: 'auto',
            height: 300,
            id: 'twtr-widget', //id of DIV
            theme:
        {
            shell:
                {
                    background: '#ff0000',
                    color: '#ffffff'
                },
            tweets:
                {
                    background: '#ffffff',
                    color: '#000000',
                    links: '#ff0000'
                }
        },
            features:
            {
                scrollbar: false,
                loop: true,
                live: true,
                hashtags: true,
                timestamp: true,
                avatars: false,
                behavior: 'default'
            }
        }
    ).render().setUser('sohelelite').start();
}

InformationsquelleAutor SohelElite

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 6000,
  width: 250,
  height: 300,
  theme: {
    shell: {
      background: '#333333',
      color: '#ffffff'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: true,
    hashtags: true,
    timestamp: true,
    avatars: true,
    behavior: 'all'
  }
}).render().setUser('roby_jazz').start();
</script>

Es ist wichtig zu erklären, deine Antwort auch wenn Ihre Antwort könnte sein, absolut richtig!

InformationsquelleAutor user816425

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.