Как добавить ссылку на каждый элемент списка?
В основном у меня есть список, и я хочу использовать js или jquery для добавления в href для моей страницы поиска.
<aside class="listlinks">
<ul>
<li>CRM</li>
<li>CTI</li>
<li>Call Center</li>
<li>Data warehouse</li>
<li>Documentum D2</li>
<li>MDM</li>
<li>SharePoint</li>
</ul>
</aside>
$('.listlinks').each(function(){
$(this).wrapInner('<a href="\search.php?' + $(this).html() + '" />');
});
4 ответа
Ваш пример будет работать до тех пор, пока вы обновите селектор jQuery, чтобы он соответствовал элементам списка, а не родительскому списку, например заменить .listlinks
на .listlinks ul li
. Вам также следует убедиться, что вы правильно закодировали текст в href
части с помощью encodeURI
или encodeURIComponent
.
Вам действительно не нужен jQuery для этого, и использование чистого Javascript и конкатенация вручную сэкономит вам 3-4 вызова функции на элемент списка.
$('.listlinks ul li').each(function(){
this.innerHTML = '<a href="\search.php?' + encodeURIComponent(this.innerHTML) + '">' + this.innerHTML + '</a>';
});
Вы можете сократить это еще больше, пожертвовав одним вызовом функции на элемент списка и используя String.prototype.link
. Метод link
автоматически переносит строковые объекты с гиперссылкой на предоставленный URL-адрес.
$('.listlinks ul li').each(function(){
this.innerHTML = this.innerHTML.link('\search.php?' + encodeURIComponent(this.innerHTML));
});
Ты мог бы сделать
$('.listlinks ul li').each(function(){
var text = $(this).html();
$(this).html('<a href="\search.php?' + encodeURIComponent(text) + '">' + text + '</a>');
});
Обновление: не забудьте закодировать текст в URL. Просто вспомнил, что
@ Райен Камта попробуйте это:
$.each($('.listlinks li'),function(k,v){
$(v).wrap('<a href="\search.php?' + $(v).html() + '" />');
});
$('.listlinks ul li').each(function(){
$(this).append('<a href="\search.php?' + $(this).html() + '" />');
});
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.