开发者

Embed <script> through jQuery?

I'm trying to append a twitter script along with some H开发者_如何学CTML via a for each loop. The loop forks fine, until I add the <script> tags at the end. What I'm trying to do is have jQuery spit out my data and then put a twitter tweet button below the information.

I'm wondering if there's another way to get jQuery to append the script to my #entries div.

My code is below:

$.each(data.Entries, function(entriesIndex, entriesObject) {

    if (entriesObject.Field21 == "Yes") {

        if (entriesObject.Field15 == "Yes") {

            $("<li />", {
                html: '<p><a href="http://twitter.com/share">foo</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></p>'


                // Add it to the page
            }).appendTo("#entries");

        } // end if entry = yes
    } // end if approved = yes

}); // end for each loop

update

Looks like it puts the script on the page but does not fire - not super familiar with how the twitter script works, but wondering if you guys could help! Thanks!

See an example page here: http://bostonwebsitemakeover.com/vote.html

    $.each(data.Entries, function(entriesIndex, entriesObject) {

        var p, tweet; // oh hey look, variables!

        if (entriesObject.Field21 == "Yes") {

            if (entriesObject.Field15 == "Yes") {

                     p = $("<p />", {
                    html: "<p>" + '<a href="' + entriesObject.Field19 + '" target="_blank">' + entriesObject.Field4  +  "</p>" + '<img src="http://images.websnapr.com/?url=' + entriesObject.Field19 + '" />' + "</a>"
                    });

                     tweet = $('<script>').attr({
                        type: 'text/javascript',
                        src: 'http://platform.twitter.com/widgets.js'

                    });

            } // end if entry = yes

        } // end if approved = yes


        $('<li class="entry">').append(p).append(tweet).appendTo('#entries');

}); // end for each loop


$('<script>').attr({
  type: 'text/javascript',
  src: 'http://platform.twitter.com/widgets.js'
}).appendTo('#entries');

I think will do the trick. Also, try to use the .attr, .text, etc. parameters when using jQuery to insert code. Makes it a little more stable, and semi-protects you from XSS.

EDIT Actually, interestingly enough, I think this is referrer-inhibited. I can't seem to get it to import, even on jsfiddle, yet I can direct-access it. I'm looking in to it though... Nevermind, seems to load, just doesn't show up in Google chrome/firebug DOM tree (yet chrome shows it loading in resources timeline).


edit Wow, ignore me. I didn't read through your question well enough. The script is obviously not yours, since it is located on twitter.com haha. I'm sorry.


Is the tweet button's script what's being loaded in the widget.js script? If so, is it a custom script that you wrote? I ask because you could modify the click handler of the button to instead be live(), and then pass the string 'click' and the function you want for the handler. That would attach the handler to each button when it's added to the page dynamically.


Looks like your <a> is missing the class "twitter-share-button"

I think from the look of it that the script looks for links with that class and generates the button and tweet count (actually an iframe)

I would have thought you need only load the script once on the page, but it may not handle links built dynamically by javascript

Edit http://dev.twitter.com/pages/tweet_button_faq#multiple-buttons definitely says to load the script only once

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜