0

我们如何在特定的 UL 元素中隐藏 href 元素（不是在所有 UL 元素中，因为 UL 元素具有相同的名称）。

例如，我们有这样的 HTML 代码：

<ul class="UL_tag">
  <li>Text 1</li>
  <li>Text 2</li> 
  <li><a href="http://www.google.com" class="description">Link to GOOGLE</a></li>
</ul>   

<ul class="UL_tag">
  <li>Text 1</li>
  <li>Text 2</li> 
  <li><a href="http://www.yahoo.com" class="description">Link to Yahoo</a></li>
</ul>

我们可以使用以下代码隐藏这些href：

$('a.description').hide();

如果我只想隐藏一个 UL 元素中的一个 href 元素，我应该如何更改这个 javascript 代码？不是所有类名为“description”的 href 元素？

感谢您的帮助！

4

6 回答 6

2

您可以使用 attr href 选择器：

$('a[href="http://www.yahoo.com"]').hide();

这是一个示例链接，您可以使用不同的方法：

这个问题也相关：jQuery cant access element with its attr href // simple tabs structure

于 2012-08-27T07:19:08.897 回答
0

id你应该给每个适当的 s <ul>：

<ul class="UL_tag" id="firstList">
  <li>Text 1</li>
  <li>Text 2</li> 
  <li><a href="http://www.google.com" class="description">Link to GOOGLE</a></li>
</ul>   

<ul class="UL_tag" id="secondList">
  <li>Text 1</li>
  <li>Text 2</li> 
  <li><a href="http://www.yahoo.com" class="description">Link to Yahoo</a></li>
</ul>

进而：

$('#firstList a.description').hide();
于 2012-08-27T07:18:57.157 回答
0

通过标记名和类选择元素，然后过滤 href 值：

$('a.description[href="http://www.google.com"]').hide();

您还可以将结果限制为仅类内的元素.UL_tag：

$('a.description[href="http://www.google.com"]', '.UL_tag').hide();
于 2012-08-27T07:32:41.127 回答
0

HTML：

<ul class="UL_tag">
  <li>Text 1</li>
  <li>Text 2</li>
  <li><a href="http://www.google.com" class="description">Link to GOOGLE</a></li>
</ul>   

<ul class="UL_tag">
  <li>Text 1</li>
  <li>Text 2</li>
  <li><a href="http://www.yahoo.com" class="description">Link to Yahoo</a></li>
</ul>

查询：

 var d = $('.UL_tag li').children('a')[1]; // If you remove first href element  change it to value "1" to "0"
 $(d).hide();

看到这个演示：http: //jsfiddle.net/7aNRZ/8/

于 2012-08-27T07:33:44.500 回答
0

感谢您的回答，我认为所有这些答案也是正确的答案，但我想要实现的有点不同。实际上有 3 个 li 元素（其中两个带有 href 标签）：

 <ul class="UL_tag"> 
   <li>There you can download something.</li> 
   <li><a href="rapidshare.com/file.zip"; class="start">Download</a></li> 
   <li><a href="google.com"; class="description">Link to GOOGLE</a></li> 
</ul>

当您单击“下载”链接时，将调用 javascript：

$(function(){
    var seconds = 10;
    var canClick = true;
    seconds *= 1000;

    $('a.start').bind('click', function(){
      if(canClick){
        var link = $(this).attr('href');
        var loader = $('input[name="link"]').val();

        $(this).html('<img src="' + loader + '"/>');
        setInterval(function(){
            window.location.reload();
            window.location = link; 
        }, seconds);
        // Description will be hidden everywhere.
        // How we can hide description in only one
        // row. In row where the a.start was called?
        $('a.description').hide();

        canClick = false;
        }
        return false;
    });
});

它将显示“加载 gif”，10 秒后用户将重定向到下载页面。

那么是否可以只在一行中隐藏“描述”而不是在任何地方。就在我们称之为“开始”功能的一排？

当所有 UL 和 li 具有相同的类名时，最大的问题是只隐藏一个 li 元素。

于 2012-08-27T17:50:11.553 回答
0

可以遍历dom获取父ul中的元素

$(this).parent().siblings().find('a.description').hide();
// get current clicked > parent li > siblings > find a.description in li siblings > hide

http://jsfiddle.net/CjfXu/1/

编辑

因为你的 li 实际上也被包裹在一个跨度内.. .parent 将无法工作，因为它正在获取 span 元素。您需要使用 .closest() - 获取匹配的最近祖先

$(this).closest('li').siblings().find('.description').hide();

也不要在另一个 click 事件中绑定 click 事件，因为这会导致 dom 将多个事件处理程序附加到元素。始终在 document.ready 函数内绑定。动态创建的元素或当您有许多需要绑定的元素时，使用委托将是最有效的方法。

你有这样的代码

$('a.start').bind('click', function(){ // <-- this should be $('a:not(.start)').bind 
     // code

     $('a.start').click(function(e) {            
         $(this).parent().siblings().find('.description').hide();
     });            

});

每次单击第一个锚时，哪个锚与 class=start 绑定任何锚

使用委托

$('parentElement').on('click','element', function(){

})

或 jQuery 1.6 及以下

$('parentElement').delegate('element','click', function(){

});
于 2012-08-27T18:01:59.423 回答