如何將javascript相同的函數帶入可重用的函數中？

Question

我只需要用執行相同功能的一個函數替換這18個函數即可。 我已經嘗試了幾種方法，但是無法使用內部的所有循環來完成它。 我已經向您展示了18個中的2個，以演示這些差異。 每個td都有一個指定的特定類，因此它將html附加到正確的位置。 任何幫助都會很棒。

頭

<script type="text/javascript">
    function getLikesFTB(thisURL) {
        // The IDs to the fan pages to like
        var likeURLs = [thisURL];

        // The base of the URL we will build to query the API  
        var reqURL = "http://graph.facebook.com/?ids=";

        // Construct the rest of reqURL using our fan pages  
        for (var i = 0; i < likeURLs.length; i++) {
            reqURL += likeURLs[i];
            if (i != (likeURLs.length - 1)) {
                reqURL += ',';
            } else {
                reqURL += "&callback=?"
            }
        };


        $.getJSON(reqURL, function (data) {
            for (var i = 0; i < likeURLs.length; i++) {
                $('<div/>', {
                    class: "likes" + likeURLs[i],
                    html: "<div class='tacoBoxText'>" + data[likeURLs[i]].likes.toLocaleString() + " people like this.</div>"
                }).appendTo('.tacoBoxMagicFTB');
            }
        });
        $.getJSON(reqURL, function (data) {
            for (var i = 0; i < likeURLs.length; i++) {
                $('<div/>', {
                    class: "name" + likeURLs[i],
                    html: "<div class='tacoBoxTitle'>" + data[likeURLs[i]].name.toLocaleString()
                }).appendTo('.tacoBoxMagicFTB');
            }
        });
    }
</script>
<script type="text/javascript">
    function getLikesCareers(thisURL) {
        // The IDs to the fan pages to like
        var likeURLs = [thisURL];

        // The base of the URL we will build to query the API  
        var reqURL = "http://graph.facebook.com/?ids=";

        // Construct the rest of reqURL using our fan pages  
        for (var i = 0; i < likeURLs.length; i++) {
            reqURL += likeURLs[i];
            if (i != (likeURLs.length - 1)) {
                reqURL += ',';
            } else {
                reqURL += "&callback=?"
            }
        };


        $.getJSON(reqURL, function (data) {
            for (var i = 0; i < likeURLs.length; i++) {
                $('<div/>', {
                    class: "likes" + likeURLs[i],
                    html: "<div class='tacoBoxText'>" + data[likeURLs[i]].likes.toLocaleString() + " people like this.</div>"
                }).appendTo('.tacoBoxMagicCareers');
            }
        });
        $.getJSON(reqURL, function (data) {
            for (var i = 0; i < likeURLs.length; i++) {
                $('<div/>', {
                    class: "name" + likeURLs[i],
                    html: "<div class='tacoBoxTitle'>" + data[likeURLs[i]].name.toLocaleString()
                }).appendTo('.tacoBoxMagicCareers');
            }
        });
    }
</script>

的CSS

.tacoBoxMagicFTB
{
    background-color: White;
    border:1px solid #b695cb;
    width:100%;
    position: relative;
    -moz-box-shadow: -1px -1px 3px #000000;
    -webkit-box-shadow: -1px -1px 3px #000000;
    box-shadow: -1px -1px 3px #000000; 
}

.tacoBoxMagicFTB img
{
    vertical-align: middle;
    padding-left: 10px;
}

的HTML

    <table id="tacoBox" cellpadding="0" cellspacing="0" width="520" border="0">
        <tr>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
            <td class="tacoBoxMagicFTB" id="tacoFTB"><img src="images/spacer.png" alt="" height="55" width="1"/><img src="images/tb_feedthebeat.png" alt=""/><script type="text/javascript">getLikesFTB('113078108881');</script></td>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
        </tr>
        <tr>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
            <td class="tacoBoxMagicCareers"><img src="images/spacer.png" alt="" height="55" width="1"/><img src="images/tb_careers.png" alt="" /><script type="text/javascript">getLikesCareers('94517856739');</script></td>
            <td><img src="images/spacer.png" alt="" class="tacoTableColumnSpacer"/></td>
        </tr>

Answer 1

您能否將函數更改為此並開始傳遞類：

 function getLikesFTB(thisURL, class) {
    // The IDs to the fan pages to like
    var likeURLs = [thisURL];

    // The base of the URL we will build to query the API  
    var reqURL = "http://graph.facebook.com/?ids=";

    // Construct the rest of reqURL using our fan pages  
    for (var i = 0; i < likeURLs.length; i++) {
        reqURL += likeURLs[i];
        if (i != (likeURLs.length - 1)) {
            reqURL += ',';
        } else {
            reqURL += "&callback=?"
        }
    };


    $.getJSON(reqURL, function (data) {
        for (var i = 0; i < likeURLs.length; i++) {
            $('<div/>', {
                class: "likes" + likeURLs[i],
                html: "<div class='tacoBoxText'>" + data[likeURLs[i]].likes.toLocaleString() + " people like this.</div>"
            }).appendTo(class);
        }
    });
    $.getJSON(reqURL, function (data) {
        for (var i = 0; i < likeURLs.length; i++) {
            $('<div/>', {
                class: "name" + likeURLs[i],
                html: "<div class='tacoBoxTitle'>" + data[likeURLs[i]].name.toLocaleString()
            }).appendTo(class);
        }
    });
}

您已經為我們找到了這兩個功能，但看來這是唯一的區別。 如果我錯過了什么，請告訴我。

Answer 2

您可以將URL作為tacoBoxMagic div上的自定義屬性添加，然后丟失className的后綴並立即執行所有操作：

$(function()
{
    $(".tacoBoxMagic[url]").each(function()
    {
        var thisURL = this.getAttribute("url");
        // The IDs to the fan pages to like
        var likeURLs = [thisURL];
        // The base of the URL we will build to query the API  
        var reqURL = "http://graph.facebook.com/?ids=";
        // Construct the rest of reqURL using our fan pages  
        for (var i = 0; i < likeURLs.length; i++) {
            reqURL += likeURLs[i];
            if (i != (likeURLs.length - 1)) {
                reqURL += ',';
            } else {
                reqURL += "&callback=?"
            }
        };
        $.getJSON(reqURL, function (data)
        {
            for (var i = 0; i < likeURLs.length; i++)
            {
                $('<div/>', {
                    class: "likes" + likeURLs[i],
                    html: "<div class='tacoBoxText'>" + data[likeURLs[i]].likes.toLocaleString() + " people like this.</div>"
                }).appendTo(this);
                $('<div/>', {
                    class: "name" + likeURLs[i],
                    html: "<div class='tacoBoxTitle'>" + data[likeURLs[i]].name.toLocaleString()
                }).appendTo(this);
            }
        });
    });
});

您的HTML看起來像這樣：

<td class="tacoBoxMagic" url="113078108881" id="tacoFTB"><img src="images/spacer.png" alt="" height="55" width="1"/><img src="images/tb_feedthebeat.png" alt=""/></td>