jquery - プラグインの各 .post の「a」名を取得する必要があります

Question

(function ($) {
    'use strict';
    var url = window.location.href.split('#')[0];
    var post = $('.post').children('a[name]').attr('name');

    var helpers = {
        "defaults": {
            "post": post,
            "href": url+'#',
            "send": 'true',
            "layout": 'button_count',
            "width": '125',
            "faces": 'false',
            "font": 'verdana',
            "action": 'like',
            "scheme": 'light',
        },

        "init": function (options) {
            var settings = $.extend({}, helpers.defaults, options),

            easyface = $('<div />').addClass('easyface fb-like').attr({
                "data-href": settings.href + settings.post,
                "data-send": settings.send,
                "data-layout": settings.layout,
                "data-width": settings.width,
                "data-show-faces": settings.faces,
                "data-font": settings.font,
                "data-action": settings.action,
                "data-colorscheme": settings.scheme
            });

            return this.each(function (i, elem) {
                var self = $(elem),                 
                data = self.data('easyface');  
                if (!data) {   
                    self.data('easyface', easyface);
                    self.append(easyface);
                }
            });
        },

        "destroy": function () {
            return this.each(function (i, elem) {
                var self = $(this),                
                data = self.data('easyface');   // test to see if we've already called init on this element

                $(window).unbind('.easyface');      // unbind any namespaced events, assuming you've namespaced them like "click.easyface"
                self.removeData('easyface');        // remove the data flag
                self.find('.easyface').remove();    // remove the appended div
            });
        }

    };

    //define the method "easyface"
    $.fn.easyface = function (method) {
        if (helpers[method]) {
            // call the method and pass in the settings
            return helpers[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            // default to the init method and pass in the arg
            return helpers.init.apply(this, arguments);
        } else {
            // throw an error
            $.error('Method ' + method + ' does not exist on jQuery.tooltip');
        }
    };
}(jQuery));

$(function() {
    $('body').append('<div id="fb-root"></div>');

    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=477049588983712";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
});

問題はここにあると思います

var url = window.location.href.split('#')[0];
var post = $('.post').children('a[name]').attr('name');
var helpers = {`

何が起こっているのかというと、次のような URL が表示されます -

http://www.easybbtutorials.com/t177-user-profile-home-page#1244#undefined

そのため、 and を追加しましたsplit('#')[0];が、うまくいきましたが、まだ未定義の部分が残っています。

http://www.easybbtutorials.com/t177-user-profile-home-page#undefined

また、.postこれがどこにあるかのそれぞれで、各親の名前を追加する必要がある各fbのいいねの同じURLですa...

言い方が混乱するかもしれませんが、今は激怒して急いで書いています。

より良い説明：

.post は最初のものであり、fb data-href はhttp://www.easybbtutorials.com/t177-user-profile-home-page#8870
.post は 2 番目のものであり、fb data-href はhttp://www.easybbtutorials.com/t177-user-profile-home-page#8871
.post は 3 番目のもので、fb data-href はhttp://www.easybbtutorials.com/t177-user-profile-home-page#8872
.post は 4 番目のものであり、fb data-href はhttp://www.easybbtutorials.com/t177-user-profile-home-page#8873

などなど、これはフォーラムなので複数の .post エリアがあります

今のところ、私はそのように呼び出しを書かなければなりません...

$('.post').each(function() {
   $(this).easyface();
  });

プラグインが本当に何でも自動的に行うようにしたい。上記のよう$('.post').easyface()なコードを自動的に実行します。

また、今のところ各投稿のも取得する必要がありますが、すべての ID が p ex: p830 p338 p395 p は post の略であるため('a[name]').attr('name');、このように追加する必要がありました。('a[name]').attr('name').split('p')[1];また、指定されたリンクは #p784 を認識しないため、#784 にする必要があります。

これを機能させることができる人は、私の評判をすべて 100 に設定することができます... 今は 43 しかありませんが、これを待つのに時間がかかりすぎました.

ここでより良い理解::

http://jsfiddle.net/zUeFL/17/

ご覧のとおり、私には 4 つの「いいね」があり、それらすべてが「いいね」を送信しています。投稿ごとに異なる URL が必要です。

score 3 · Accepted Answer

問題 1:

var post = $('.post').children('a[name]').attr('name');

children()要素のリストを返します。

問題 2:

$(document).readyブロック内からプラグインを実行するだけです。

解決

これを試して...

$(document).ready(function() {
    //run the plugin

    pNames = []

    $('.post').children('a[name]').each(function() {
        pNames.push($(this).attr('name'));
    });

    $('.postfoot').easyface({
        "post": pNames
    });
});

アップデート

a必要な要素が 1 つだけの場合は、次のようにします。

var post = $('.post').children('a[name]')[0].attr('name');

の作成時に次の変更を行いますhref。

easyface = $('<div />').addClass('easyface fb-like').attr({
    "data-href": settings.href.substring(0, settings.href.length - 1) + "#" + settings.post.split("p")[1], // concatenate with your href here.

更新された jsFiddle: http://jsfiddle.net/zUeFL/21/

score 1 · Accepted Answer

私はこれがあなたが探しているものだと思います：デモ

主な変更点は次のとおりです。

投稿IDはeach()ループ内で計算されます。これは、投稿IDがそれぞれ異なるためです.postfoot。
```
post = (options && options.post) || self.closest('.post').find('a:first').attr('name');
```
これにより、投稿IDをoptionsオブジェクトで上書きできるようになりますが、これはお勧めできません。
easyfacedivもループ内に作成されます。これeach()も、それぞれごとに異なるため.postfootです。

jquery - プラグインの各 .post の「a」名を取得する必要があります

2 に答える 2

Related

Reference