1

所以这是我的困境。一直在这里使用这个 Jquery 极端代码，我需要帮助来判断某个链接是否显示。这就是我所拥有的。

切换：

<a href="#" id="visbilitybutton" class="button" title="Visible"><span class="icon icon84"></span></a>

<a href="#" id="visbilitybutton" class="button" title="Invisible"><span class="icon icon85"></span></a>

（注意唯一不同的是图标编号）当有人单击#visbility 按钮时，这些需要来回切换。不确定执行此操作以及捕获所选内容的最佳方法。

我目前拥有的唯一代码使切换单向，但再次单击时不会返回。

 $(document).ready(function () { 
    $('#visbilitybutton').click(function() {
         $(this).replaceWith('<a href="#" id="visbilitybutton" class="button" title="Invisible"><span class="icon icon85"></span></a>');
    }); 
    });
4

3 回答 3

1

首先，您id的页面上不应有多个相同的属性。做visibilitybutton一堂课。

无论如何，您可以使用 jQuerytoggle()函数来指定每次连续单击时要执行的操作：

$(".visibilitybutton").toggle(function(){
    $(this)
        .attr("title","Invisible")
        .find("span").toggleClass("icon84 icon85");
}, function(){
    $(this)
        .attr("title","Visible")
        .find("span").toggleClass("icon84 icon85");
});

如果您想提高效率，您可以像这样使用 jQuery 一口气完成所有操作，并使用一些好的技术：

var vis = ["Invisible","Visible"];
$(".visibilitybutton").click(function(){
    var i = 0;
    $(this)
        .attr("title",vis[i])
        .find("span").toggleClass("icon84 icon85");
    i = (i==0)?1:0;
});

更重要的是创建一个在添加元素时隐藏元素并在删除它时显示它的类（display:none在 CSS 中应用的类名可以正常工作）：

$(".visibilitybutton").click(function(){
    $(this)
        .toggleClass("hide")
        .find("span").toggleClass("icon84 icon85");
});
于 2012-07-23T17:49:27.117 回答
1

你需要有唯一的ID；因此，您应该按类别选择项目。你可以使用toggle()来处理连续的点击，你可以使用toggleClass()来处理类的交换。

HTML：

<a href="#" class="button" title="Visible"><span class="icon icon84"></span></a>
<a href="#" class="button" title="Invisible"><span class="icon icon85"></span></a>

Javascript：

 $(document).ready(function () { 
    $('.button').toggle(function() {
          var $button = $(this);

          $button.prop("title","Invisible");
          $button.find('.icon85').toggleClass('icon85', 'icon84');
    }, function() {
          var $button = $(this);

          $button.prop("title","Visible");
          $button.find('.icon85').toggleClass('icon84', 'icon85');
    });
 });
于 2012-07-23T17:49:39.333 回答
0

该id属性应该对每个元素都是唯一的。id将属性更改class为每个超链接的属性。

然后，在您的 jQuery 代码中，通过类名获取超链接：

$('.visbilitybutton').click(function() {
    // code goes here
});

在您的事件处理程序中，您应该使用 testtitle属性，如下所示：

$('.visibilitybutton').click(function() {
    $this = $(this);
    if ($this.attr("title") == "Visible")
        $this.attr("title", "Invisible").find("span")
            .removeClass("icon85").addClass("icon84");
    else
        $this.attr("title", "Visible").find("span")
            .removeClass("icon84").addClass("icon85");
});
于 2012-07-23T17:56:15.623 回答