如何在javascript中让一个链接变成灰色,不可点击?

在做分页的过程中遇到了这个问题,比如在第一页时“上一页”的链接就变灰,快点,紧急紧急!... 在做分页的过程中遇到了这个问题,比如在第一页时“上一页”的链接就变灰,快点,紧急紧急! 展开
 我来答
森林的沉睡
推荐于2017-09-01 · TA获得超过297个赞
知道小有建树答主
回答量:179
采纳率:85%
帮助的人:155万
展开全部

直接试用disable不同浏览器及版本的兼容例外多,不建议直接disable超链接.

以下通过调整样式和行为的方式实现上述需求:

  1. 定义一个超链接"变成"普通html文本的样式

  2. 在某个行为中触发"变灰"

  3. 在原链接的事件中加入如果已经有"变灰"的class则直接返回

  4. 在另外的行为中恢复"正常"

以下为模拟的代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
<style>
/* "变灰"效果*/
.disableHref{
    cursor:default;
color:#E5E0E0;
text-decoration:none;
}
</style>
  <script>
  // 禁用超链接-"变灰"
function  disableHref(){
    var hrefDom = document.getElementById("testHref");
hrefDom.className+=" disableHref";
}
 // 启用超链接-"正常"
function  enableHref(){
    var hrefDom = document.getElementById("testHref");
hrefDom.className=hrefDom.className.replace(" disableHref","");
}
 // 超链接点击事件
function hrefClick(){
    var target=event.target;
    if(target.className.indexOf("disableHref")>-1){
     // 加入判断,有"变灰"时返回
     return false;
}
// do something u need
// for example
alert("jump previous");
}

  </script>
 </HEAD>

 <BODY>
  <a href="javascript:;" id="testHref" onclick="hrefClick()" class="ttt">test href</a>
  <input type="button" id="btnDisableHref" onclick="disableHref()" value="Disable href" />
  <input type="button" id="btnEnableHref" onclick="enableHref()" value="Enable href" />
 </BODY>
</HTML>
匿名用户
2013-07-20
展开全部
根据经验,通常这个只是把字体变成灰色,不设置链接,而不是用JS控制,JS可控制文本输入框,按钮等,如果一定要用JS控制的话,试试这个,但很多浏览器会失败:给链接加个ID如:<a href=" http://www.baidu.com" id="yourHrefId">fdf</a>再写个JS
<script language="javascript">
document.getElementById("yourHrefId").disabled=true
</script>
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2013-07-20
展开全部
后台输出 的时候 不要给上一页加链接这个和客户端无关
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 1条折叠回答
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式