Замена альтернативного текста гиперссылкой

На данный момент у меня есть этот код, который заменяет класс span гиперссылкой. Гиперссылка включает в себя аббревиатуру, а альтернативный текст для гиперссылки включает в себя ту же аббревиатуру. Теперь я хочу как-то заменить второе сокращение в альтернативном тексте гиперссылки. Так что здесь не "нажмите здесь, чтобы посетить + название аббревиатуры", а псевдоним. Так что если сокращение - ggl, псевдоним должен быть google. Но гиперссылка не должна использовать этот псевдоним. СБ может мне помочь? Спасибо

(function($) {
    var number = "1234567";

    function linkBuilder(abbreviation) {
        return "<a href='https://www.test.com/" + abbreviation + "?sitenumber=" + number + "default'>Click here to visit " + abbreviation + "</a>";
    }

    function linkBuilder2(abbreviation2) {
        return "<a href='https://www.test.com/" + abbreviation2 + "?sitenumber=" + number + "default'>Click here to visit " + abbreviation2 + "</a>";
    }
    jQuery(document).ready(function() {
        var fl = $(".first-link");
        if (fl.length > 0) {
            fl.html(linkBuilder(fl.data("abbreviation")));
        }
        var sl = $(".second-link");
        if (sl.length > 0) {
            sl.html(linkBuilder2(sl.data("abbreviation2")));
        }
    });
})(jQuery);

2 ответа

Решение

Вот рабочий jsfiddle:

https://jsfiddle.net/e7qdx031/1/

linkBuilder() должен использоваться повторно, как упоминал kalsowerus.

Еще одна вещь, которая должна быть упомянута, состоит в том, что следующий код возвращает коллекцию элементов, а не только один элемент.

var fl = $(".first-link");
...
var sl = $(".second-link");

Предоставленный вами код не будет работать должным образом, если на странице есть несколько классов.first-link. Поэтому вместо этого я бы перебирал каждый элемент с помощью $.each() и запускал для них функцию linkBuilder() по отдельности.

Что касается функции linkBuilder, я бы изменил ее, чтобы она принимала объект элемента, а затем прочитал свойства, чтобы получить псевдоним и имя. Полное имя - это то, что вы указали, что вам нужно, но не присутствовали в коде.

(function($) {
    var number = "123456";

    function linkBuilder($obj) {
        var abbreviation = $obj.data('abbreviation');
        var name = $obj.data('name');
        return "<a href='https://www.test.com/" + abbreviation + "?sitenumber=" + number + "default'>Click here to visit " + name + "</a>";
    }

    jQuery(document).ready(function() {
        $('.first-link, .second-link').each(function(index, obj){
            $(obj).html(linkBuilder($(obj)));
        });
    });
})(jQuery);

То, что вы, вероятно, хотите, что-то вроде этого:

function linkBuilder(abbreviation, alias) {
    return "<a href='https://www.test.com/" + abbreviation + "?sitenumber=" + number + "default'>Click here to visit " + alias + "</a>";
}

Просто передайте отображаемое имя для вашей ссылки в качестве второго аргумента.

Другие вопросы по тегам