禁用JQuery链接

时间:2009-02-25 13:37:23

标签: jquery asp.net-mvc

我有以下代码,它的功能类似于注释链接在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();
        });
    });

我希望能够做一件事情,改变他们点击的链接文字,说出类似“隐藏”的内容,并禁用此链接所在的小菜单中的其他链接。

修改 使用此函数的源代码如下所示

<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>

4 个答案:

答案 0 :(得分:9)

如果您想删除链接而不是禁用它:

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项目的变量之前加上$,以帮助它们在代码中以可视方式分开。它还可以帮助您识别可以调用方法。
  • 答案 1 :(得分:4)

    要修改功能中的链接文本,只需使用:

    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 :(得分:3)

    有几种方法可以解决这个问题,最简单的方法就是: $( 'a')的过滤器( '不是:#doneLink')隐藏(); 隐藏所有不是您上面指定的链接。

    有关jQuery选择器的更多信息,请查看此页面:

    http://docs.jquery.com/Selectors

    答案 3 :(得分:1)

    禁用锚点的最简单方法是使用disabled-attribute,但问题是IE只支持给定属性。例如,它不适用于FireFox。如果您希望代码在不同的浏览器中工作,可以尝试将href和onclick属性的值保存到其他自定义属性中,然后设置href="#"onclick="return false;"。启用后,您应该恢复href和onclick的已保存值。对于视觉效果,您可以使用specila css-class。我在博客中描述了这种方法 - Disable hyperlink