Кнопка "Мне нравится" в Facebook на странице, управляемой AJAX - ошибка Firefox
У меня есть кнопка, похожая на Facebook, которая загружается с помощью ajax. Кнопка работает, но, как ни странно, в Firefox она не появляется.
<fb:like href="@Model.Url" show_faces="true" height="30" width="400" ></fb:like>
В Firefox html создается с высотой = 0px. Зачем?
<span style="height: 0px; width: 400px;">
<iframe id="f2b3cbcbf388e" class="fb_ltr " scrolling="no" name="f3cdf7e205a545e" style="border: medium none; overflow: hidden; height: 0px; width: 400px;" ....
Это не происходит в Chrome.
Связано с facebook У меня есть только это, прежде чем закрыть тег
<script> (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/pt_PT/all.js#xfbml=1&appId=00000";
fjs.parentNode.insertBefore(js, fjs);
} (document, 'script', 'facebook-jssdk'));</script>
4 ответа
Если у меня есть более одной кнопки "Нравится" на Facebook, у него странное поведение. Я переместил кнопку на страницу сведений вместо страницы списка, и это решило мою проблему.
Я все еще исследую причину, но в моем случае, я думаю, это потому, что содержащийся div скрыт во время синтаксического анализа XFBML. Все еще ищем лучшее решение, но это можно исправить, очистив вручную добавленную высоту css следующим образом:
FB.XFBML.parse(document, function(){
$('.fb_button_container iframe').css('height','');
$('.fb_button_container .fb-like > span').css('height','');
});
это использует JQuery... вы можете легко не использовать его, если вы предпочитаете. Также в этом случае я добавил кнопку "Мне нравится" внутри контейнера с классом "fb_button_container" - это не что-то автоматически сгенерированное.
У меня такая же проблема. Кнопка была правильно отображена во всех других распространенных браузерах, кроме Firefox. Каким-то образом встроенный стиль диапазона был установлен в Firefox на 0 пикселей. Благодаря theozero мне наконец удалось правильно отобразить кнопку. Как и theozero, у меня была кнопка "Мне нравится" в Facebook внутри div, который скрыт с помощью JS при загрузке страницы. С ответом theozero я нашел в Facebook документацию по FB.XFBML.parse и поместил их функцию повторного анализа точно в конце первоначально предоставленного Facebook JavaScript SDK (последняя строка):
(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/de_DE/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
FB.XFBML.parse();
И вуаля кнопка была оказана!
РЕДАКТИРОВАТЬ: слишком счастлив, слишком рано. Это только сработало, потому что сразу при загрузке страницы я показал div, содержащий кнопку. Затем я поместил функцию разбора в JS, которая показывает div. Это работает. Оно делает. Но теперь элемент больше не плавно переключается... Аааа! Facebook! Отверстие!
РЕДАКТИРОВАТЬ: Так! Теперь это сделано. Пришлось вызывать повторный анализ как функцию обратного вызова для функции slideToggle, чтобы повторно проанализировать элемент, когда действие переключения было завершено. .slideToggle('slow', function(){ FB.XFBML.parse(); });
Конечно, кнопка "лайк" вдруг неожиданно появляется, но я могу с этим смириться, хотя я мог позволить кнопке как-то исчезнуть.
Мне потребовался целый день, чтобы понять это, но после входа в систему на Facebook с "тестовым пользователем" кнопка "Мне нравится" становится невидимой. В моем случае, я всегда входил в систему с моим тестовым пользователем в Firefox, в то время как выходил из системы / входил в систему с моим обычным пользователем Facebook в Chrome (и я изначально думал, что это проблема браузера).
Тем не менее, решение было так же просто, как выйти из тестового пользователя.
В документации FB указано, что не все функции включены для тестовых пользователей (и кнопка "Мне нравится" - одна из этих функций), но я подумал, что она будет по крайней мере визуализирована. Во всяком случае, я надеюсь, что это кому-то поможет.