Отключение ссылок с помощью JQuery
У меня есть следующий код, который выполняет функцию, аналогичную тому, как работает ссылка комментариев в Stackoverflow... при нажатии на нее запускается ActionResult и заполняется div
$(function() {
$("a[id ^='doneLink-']").live('click', function(event) {
match = this.id.match(/doneLink-(\d+)/);
container = $("div#doneContainer-" + match[1])
container.toggle();
if (container.is(":visible")) {
container.load($(this).attr("href"));
} else {
container.html("Loading...");
}
event.preventDefault();
});
});
Я хочу, чтобы каждый мог изменить текст ссылки, на который они нажали, чтобы сказать что-то вроде "Скрыть", а также отключить другие ссылки в маленьком меню, в котором находится эта ссылка.
Edit:
Источник для этой функции выглядит следующим образом:
<div id="dc_lifelistmenu"style="float:left;padding-bottom:5px;font-size:10pt;width:400px;">
<a href="/entries/addentry/86">Add Entry</a> |
<a href="/goals/adddaimoku/86" id="daimokuLink-2">Log Daimoku</a> |
<a href="/goals/done/86" id="doneLink-2">Mark Completed</a> |
<a href="/goals/remove/86">Remove</a>
</div><br />
<div id='daimokuContainer-2' style="display:none;"> Loading...</div>
<div id='doneContainer-2' style="display:none;"> Loading...</div>
Ответы
Ответ 1
Чтобы изменить текст ссылки внутри вашей функции, просто используйте:
this.text('New Text!');
Чтобы отключить другой текст, нам нужно будет увидеть источник страницы. Я не уверен, что вы подразумеваете под "другими ссылками"...
ОБНОВЛЕНИЕ. Основываясь на вашем редактировании, я предполагаю, что вы хотите:
$(function() {
$("a[id ^='doneLink-']").live('click', function(event) {
match = this.id.match(/doneLink-(\d+)/);
container = $("div#doneContainer-" + match[1])
container.toggle();
if (container.is(":visible")) {
container.load($(this).attr("href"));
} else {
container.html("Loading...");
}
event.preventDefault();
// added
this.text('Hide');
// disable others manually, repeat and adjust for each link
$("#daimokuLink-" + match[1]).toggle();
// or in one shot, all but the one I clicked
$("#dc_lifelistmenu:not(#doneContainer-" + match[1] + ")").toggle();
});
});
ОБНОВЛЕНИЕ 2: Выпили свой комментарий. Чтобы отключить ссылку, а не скрывать ее, отключите onclick
, переопределив ее, вместо использования toggle()
.
$("#daimokuLink-" + match[1]).click(function() { return false; });
Ответ 2
Если вы хотите удалить ссылку, а не отключить ее:
jQuery('#path .to .your a').each(function(){
var $t = jQuery(this);
$t.after($t.text());
$t.remove();
});
Примечание:
Вы также можете использовать функцию (k, v) для захвата итератора и элемента без использования 'this'
Невозможно заменить jQuery на $, если вы используете пространство имен по умолчанию
var $t = jQuery (this) - это функция кэширования, которая ссылается на элемент, а также помогает очистить код
Хорошая практика предшествует переменным, которые на самом деле являются элементами jQuery с помощью $, чтобы помочь им визуально разделить их в коде. Это также помогает вам понять, что вы можете вызывать методы на них.
Ответ 3
Есть несколько способов приблизиться к этому, возможно, самым простым является просто сделать что-то вроде:
. $( 'А') фильтр ( ': не #doneLink') скрыть();.
чтобы скрыть все ссылки, которые вы не указали выше.
Посмотрите эту страницу для получения дополнительных сведений о селекторах jQuery:
http://docs.jquery.com/Selectors
Ответ 4
Самый простой способ отключить привязку - это использование атрибута disabled-а, но проблема в том, что данный атрибут поддерживается только IE. Например, он не будет работать в FireFox. Если вы хотите, чтобы ваш код работал в разных браузерах, вы можете попытаться сохранить значения атрибутов href и onclick в других настраиваемых атрибутах, а затем установить href="#"
и onclick="return false;"
. Включение обратно необходимо восстановить сохраненные значения href и onclick. Для визуального эффекта вы можете использовать применение specila css-class. Я описал этот подход в своем блоге - Отключить гиперссылку