问题描述
我正在尝试将切换禁用/启用脚本应用于链接，以便如果单击链接，则将其禁用并在单击另一个链接后重新启用。
要检查禁用的链接，我正在使用警报，理想情况下，禁用时不会触发。
我正在与：
$('body').on('click', 'a.disabled', function (event) {
event.preventDefault();
});
jQuery.fn.extend({
disable: function (state) {
return this.each(function () {
var $this = $(this);
$this.toggleClass('disabled', state);
});
}
});
// Disabled with:
$('a').disable(true);
// Enabled with:
$('a').disable(false);
$('.link_1').click(function () {
alert('link_1 clicked');
});
$('.link_2').click(function () {
alert('link_2 clicked');
});
并设置了JS Bin
1楼
V-Development
1
2015-08-07 06:41:03
您可以使用此处理程序执行相同的操作
$('body').on('click', 'a, function (event) {
$('a.disabled').removeClass('disabled');
$(this).addClass('disabled');
});
2楼
KAD
0
2015-08-07 06:46:49
我添加了一个链接类，以捕获所有链接，当单击这些链接中的任何一个时，启用所有链接并禁用单击的链接。
$(document).ready(function () { jQuery.fn.extend({ disable: function (state) { return this.each(function () { var $this = $(this); if ($this.is('input, button')) this.disabled = state; else $this.toggleClass('disabled',state); }); } }); $('.links').click(function (event) { event.preventDefault(); if(!$(this).hasClass('disabled')) { alert($(this).attr('class').split(' ')[0] + ' clicked'); } $('.links').disable(false); $(this).disable(true); }); });
.disabled { color :red; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a class="link_1 links">My Link1</a> <a class="link_2 links">My Link2</a> <a class="link_3 links">My Link3</a>
3楼
Kishan
0
2015-08-08 05:47:31
尝试这个
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(document).ready(function(){ $("a").click(function(){ $("a.togle").toggle(); }); }); </script> </head> <body> <a class="togle">This is a paragraph 1 .</a></br> <hr> <a >Toggle between hide() and show()</a> </body> </html>