Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Хаки » Аватар по первой букве имени?

Аватар по первой букве имени?


     12.11.2014    Все вопросы » Хаки    3591

вопрос
Как можно реализовать.
Пользователь без аватара -> присваивать аватар по первой букве имени.
Фото A .... Z, если Pavel, то берем картинку P.png.

Ответил: D0Gmatist


Примеры вставки
<img data-login="{login}" data-url="http://сайт.ру/uploads/fotos/">
<img data-login="{login}" data-url="http://сайт.ру/uploads/fotos/">

JS код
$(document).ready(function () {
    $('img[data-login]').each(function () {
        var a = $(this).data('login'),
            b = $(this).data('url');
        $(this).attr({
            'src': b + a[0] + '.png'
        })
    });
});

В результате JS при разгрузке страницы получит атрибут data-login ( первый символ ) и data-url и сформирует url на картинку и вставит создав атрибут src
В результате будет
<img data-login="abc" data-url="http://сайт.ру/uploads/fotos/" src="http://сайт.ру/uploads/fotos/a.png">
<img data-login="cba" data-url="http://сайт.ру/uploads/fotos/" src="http://сайт.ру/uploads/fotos/c.png">

4 комментария

D0Gmatist
Юзер

D0Gmatist - 12 ноября 2014 22:44 -

Можно ещё так
$(document).ready(function () {

    $('img[data-login]').each(function () {
        var a = $(this).data('login'),
            b = $(this).data('url');

        $(this).attr({
            'src': b + a[0] + '.png'
        });

        $(this).removeAttr('data-login').removeAttr('data-url');

    });

});
по итогу после вставки src удалит атрибуты data-login и data-url

vitnet
PHP-developer

vitnet - 13 ноября 2014 11:10 -

+ чтобы не плодить кучу аватарок (a-z, A-Z) можно перевести первую букву в верхний регистр
$(document).ready(function () {
    $('img[data-login]').each(function () {
        var a = $(this).data('login'),
            b = $(this).data('url');

        $(this).attr({
            'src': b + a[0].toUpperCase() + '.png', 'alt': a
        });

        $(this).removeAttr('data-login').removeAttr('data-url');
    });
});

insauce
Юзер

insauce - 13 ноября 2014 11:26 -

А если аватарка есть у пользователя, он будет подставлять по букве всё равно?

код ещё не проверял

D0Gmatist
Юзер

D0Gmatist - 13 ноября 2014 15:27 -

Цитата: insauce
А если аватарка есть у пользователя, он будет подставлять по букве всё равно?
Можно добавить условие
<img data-login="abc" data-url="http://сайт.ру/uploads/fotos/" src="/templates/madison2/dleimages/noavatar.png">
<img data-login="cba" data-url="http://сайт.ру/uploads/fotos/" src="/templates/madison2/dleimages/noavatar.png">

$(document).ready(function () {
    $('img[data-login]').each(function () {
        var a = $(this).data('login'),
            b = $(this).data('url'),
            c = $(this).attr('src'),
            cs = c.split('/');

        if (cs[cs.length - 1] == "noavatar.png") {

            $(this).attr({
                'src': b + a[0].toUpperCase() + '.png',
                'alt': a
            }).removeAttr('data-login').removeAttr('data-url');

        }

    });
});
получаем src разбиваем строку по слешу на массив и получаем последнюю запись (название картинки с расширением), если запись равна картинке по умолчанию "noavatar.png" заменяем

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх