Javascript 单击html后禁用href？_Javascript_Jquery_Html

Javascript 单击html后禁用href？

javascript jquery html

Javascript 单击html后禁用href？,javascript,jquery,html,Javascript,Jquery,Html,我希望在单击一次后禁用href，可以使用javascript或jquery完成吗请帮忙 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns ="http://www.w3.org 1999 xhtml" xml :lang="en"> <head> <

我希望在单击一次后禁用

href

，可以使用javascript或jquery完成吗

请帮忙

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns ="http://www.w3.org 1999 xhtml" xml :lang="en">
  <head>
    <style>

     a:link{
       color:#1DAAA1;
     }

     a:visited{
       color:green;
     }

     a:hover{
       background: #ff0000;
       color: #FFF;
     }

    </style>
  </head>
  <body>
    <table width="500" align="center" border="5px solid">
      <tr align="center" >
        <td><a href="http://www.google.com.my/" onclick="return false"> Google </a></td>
        <td><a href="http://www.yahoo.com/"> Yahoo </a></td>
        <td><a href="http://www.bing.com/"> Bing </a></td>
        <td><a href="http://en.wikipedia.org/wiki/Main_Page"> Wikipedia </a></td>
        <td><a href="https://www.facebook.com/"> Facebook </a></td>                         
     </tr>
    </table>
  </body>
</html>


a:链接{
颜色：#1DAAA1；
}
a:参观了{
颜色：绿色；
}
a:悬停{
背景：#ff0000；
颜色：#FFF；
}

试试这个

a:visited {
 color:green;
 pointer-events: none;
 cursor: default; 
}

这次我试着用Javascript。。。希望它能帮助你：）只需在所需href标记的“onclick（）”中调用以下函数

function check(link) {
    if (link.className != "visited") {
       //alert("new");
       link.className = "visited";
       return true;     
    }
    //alert("old");
    return false;
}

像<代码>

请参见演示

jQuery解决方案：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns ="http://www.w3.org 1999 xhtml" xml :lang="en">
<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>        
        <script type="text/javascript">
            function check(link) {
                $(link).replaceWith($(link).text());
            }
        </script>
        <style>

            a:link{
                color:#1DAAA1;

            }
            a:visited{
                color:green;
            }
            a:hover{
                background: #ff0000;
                color: #FFF;
            }

        </style>

    </head>
    <body>

        <table width="500" align="center" border="5px solid">
            <tr align="center" >
                <td><a href="http://www.google.com" target="_blank" onclick="return check(this);"> Google </a></td>
                <td><a href="http://www.yahoo.com" target="_blank" onclick="return check(this);"> Yahoo </a></td>
                <td><a href="http://www.bing.com" target="_blank" onclick="return check(this);"> Bing </a></td>
                <td><a href="http://en.wikipedia.org" target="_blank" onclick="return check(this);"> Wikipedia </a></td>
            </tr>

        </table>
    </body>
</html>


功能检查（链接）{
$（link）.replace为（$（link）.text（））；
}
a:链接{
颜色：#1DAAA1；
}
a:参观了{
颜色：绿色；
}
a:悬停{
背景：#ff0000；
颜色：#FFF；
}

您可以使用jquery

<a href='http://somepage.com' id='get' onlick='$("#"+this.id).attr("href","")'>Something to be go </a>

或者使用javascript

<a href='http://somepage.com' id='get' onlick='document.getElementById(this.id).removeAttribute("href");'>Something to be go </a>

根据Ayyappan Sekar的回答，我刚刚使用jQuery做了一些非常类似的事情：

$('#yourId').click(function (e) {
    if(!$(this).hasClass('visited'))
    {
        $(this).addClass('visited')
        return true;
    }
    else
    {
        $(this).removeAttr("href"); // optional
        // some other code here
        return false;
    }
});

这是一种更简单的方法，使用jQuery可以防止链接双击：不

onclick

attributes，不需要

id

，不

href

删除

$("a").click(function (event) {
    if ($(this).hasClass("disabled")) {
        event.preventDefault();
    }
    $(this).addClass("disabled");
});

提示：您可以使用任何选择器（如

按钮

，

输入[type='submit']

等），它都可以工作。

纯javascript解决方案：

<script> 
   function clickAndDisable(link) {
     // disable subsequent clicks
     link.onclick = function(event) {
        event.preventDefault();
     }
   }   
</script>
<a href="target.html" onclick="clickAndDisable(this);">Click here</a>


功能单击并禁用（链接）{
//禁用后续单击
link.onclick=函数（事件）{
event.preventDefault（）；
}
}

在html和css中复制相同的div，复制的div必须低于原始div，使用：z-index=-1或/和位置：absolute

将原始div onclick=“HideMe（this）”

JS:
函数隐藏（元素）{
element.style.display='none'；
}

这可能不是最好的方法，但100%的目标是可以实现的

纯JavaScript解决方案，允许用户只跟随URL一次：

<a id="elementId" 
   href="www.example.com" 
   onclick="setTimeout(function(){document.getElementById('elementId').removeAttribute('href');}, 1);"
   >Clik and forget</a>

单击后，将删除href属性（等待1毫秒以允许原始操作开始），从而使链接保持静默。与Dineshkani的建议类似，但最初的答案导致操作在某些浏览器上根本无法启动。

我想在这里留下一个与IFrame一起使用的Knockout.js一起使用的示例，但由于IFrame不与本地文件一起使用，因此我使用divs制作了这个示例。单击该链接时，会调用该函数，正如您在内部注释的

alert（）

中所看到的，但是当您在输入对话框中拨出某个内容并再次单击该链接时，只有在单击调用相同函数但参数不同的其他链接时，才会通过Knockout.js更新div


功能myPage2（nPage）{
var cPage='Pagina 2'；
如果（nPage==3）{cPage='pagina3'}
cPage+=''；
//警报（'clicked！'）；
返回注册会计师
}
var viewModel={
护墙板：可观察的
}
ko.bindingHandlers.bindHTML={
init：函数（）{
//防止在动态注入的HTML上绑定（因为开发人员不太可能预料到这一点，而且这会带来安全隐患）
返回{'ControlsDescentBindings'：true}；
},
更新：函数（元素、valueAccessor、allBindings、viewModel、bindingContext）{
//如果需要，setHtml将打开该值
setHtml（元素，valueAccessor（））；
var elementsToAdd=element.children；
for（变量i=0；i

对于jQuery，请查看Hi并找到新答案……希望它能满足需要：）禁用是什么意思？不可链接？是的，单击一次或访问一次Estill后不可链接，+1表示使用一个鲜为人知的CSS属性的创造性解决方案。@JanDvorak:感谢+1。。希望我能尽快得到更好的链接：）它不起作用，我仍然可以进入访问页面…点击一次后访问的链接必须完全禁用。为什么要使用jQuery进行此操作，甚至不绑定事件？@StephanMuller:我希望在点击一次后禁用href，可以使用javascript或jQuery完成吗？-问题很清楚。它很有用，但在重新加载/刷新页面后仍然可以访问记住：复制的div/anchor不能包含href属性。+10按钮在哪里？完美的解决方案，我可以排除链接吗？MrPHP，是的，你可以使用任何你想要的选择器，例如，不用

$（“a”）

使用

$（“按钮”）

<a id="elementId" 
   href="www.example.com" 
   onclick="setTimeout(function(){document.getElementById('elementId').removeAttribute('href');}, 1);"
   >Clik and forget</a>