Изменение динамического текста ссылки в Javascript

В настоящее время у меня есть слайд-шоу с HTMl CSS и JS в настоящее время для кнопок навигации под слайд-шоу, это просто размещение чисел вместо текста. Есть ли способ захватить название изображения и использовать его или пользовательский текст для каждой слайдовой ссылки. Ниже я включил Javascript, который делает кнопки навигации и добавляет текст. Если вам нужно что-нибудь еще, просто дайте мне знать.Изменение динамического текста ссылки в Javascript

Если я могу просто указать текст в этом JS-файле, который тоже будет работать.

Также, если это может помочь им использовать HTML-шаблон Kickstart. Ссылка для его просмотра http://bliskdesigns.com/clients/timbr/

var items = $(this).find('li'); 
    wrap.append('<ul class="slideshow-buttons"></ul>'); 
    items.each(function(index){ 
     wrap.find('.slideshow-buttons') 
     .append('<li><a href="#slideshow-'+index+'" rel="'+index+'">'+(index+2)+'</a></li>'); 
    });

источник

2013-11-29 Al3xhamilton

На данный момент действительно не хватает кода, чтобы кто-нибудь понял, что происходит. Лучше всего потратить несколько минут на создание рабочего примера на [JSFiddle] (http://jsfiddle.net/). При этом мы могли бы лучше понять, что вы спрашиваете, и как работает ваша текущая реализация. – johnkavanagh

Вот ссылка на JS Fiddle Но, похоже, это не работает. http://jsfiddle.net/3gRJ9/ Также здесь ссылка на него, работающая http://bliskdesigns.com/clients/timbr/ – Al3xhamilton

Это трудно дать вам краткий ответ с тем, что вы предоставили, однако:

Если предположить, что в коде вы предоставили:

items - это массив, содержащий каждый слайд в вашем слайд-шоу;
То, что каждый элемент в items содержит img;
То, что текст, который вы хотите отобразить в навигаторе слайд-шоу, - это атрибут title каждого img;
Это неупорядоченный список, созданный wrap - это навигация;
Чтобы текст, который вы хотите изменить, представляет собой цифру в пределах anchor каждого предмета, введенного в wrap.

Вот потенциальный ответ:

// put all slides into 'items' 
var items = $(this).find('li'); 

// append the wrap element with an unordered list 
wrap.append('<ul class="slideshow-buttons"></ul>'); 

// loop over each item 
items.each(function(index){ 
    // grab the title attribute of the img child of this instance of items 
    var titleText = $(this).find('img').attr('title'); 

    // push a new <li> into 'wrap' 
    wrap.find('.slideshow-buttons').append('<li><a href="#slideshow-'+index+'" rel="'+index+'">'+titleText+'</a></li>'); 
});

Это должно быть просто прямая замена везде, где в вашем проекте код, который вы включили выше пришли.

Как я уже сказал: я не могу обещать, что это будет работать без гораздо большей информации, но теоретически это будет. Убедитесь, что каждый из ваших изображений имеет название:

В качестве альтернативы, вы можете использовать текст в alt теге IMAGE вместо изменив эту строку сверху:

// grab the alt attribute of the img child of this instance of items 
var titleText = $(this).find('img').attr('alt');

источник

2013-11-29 15:10:15 johnkavanagh

Работала Perfect Thanks, как вы можете видеть здесь http: // bliskdesigns.com/clients/timbr/он использовал заголовки идеально. – Al3xhamilton

В элементах списка вы может добавить текст, который вы хотите отобразить вместо цифр, как показано ниже.

<li data-displayText="Timber Mart"><a href="http://www.timbermart.ca/credit-card"> <img src="http://i.imgur.com/4XKIENA.png" width="920" /> </a></li>

Затем в приведенном выше коде вы можете использовать текст вместо индекса, как показано ниже.

wrap.find('.slideshow-buttons') 
     .append('<li><a href="#slideshow-'+index+'" rel="'+index+'">'+$(items[index]).attr("data-displayText")+'</a></li>');

источник

2013-11-29 15:20:40

Изменение динамического текста ссылки в Javascript

ответ

Смежные вопросы