Question

我有一个带有div的html页面，在这个div里面我有很多链接，有些是网站，有些是pdf。我希望能够使用jQuery，以便在单击按钮时，仅显示pdf链接。我是jQuery的新手，想知道我怎么能这样做。

Answer 1

首先在你的html文件中加载JQuery：你可以使用这个示例代码：

    $( document ).ready(function() {
     //create variable and hide it at start
     var pdf_links = $("#pdf_links").hide();

     //onclick function with show function
     $("button").click(function(){
         pdf_links.show();
     });
    });

更多信息：http://www.w3schools.com/jquery/jquery_hide_show.asp

Answer 2

jQuery选择器的功能与CSS selectors非常相似，所以您只需选择hrefs以.pdf结尾的锚标签，如下所示：$('a[href$=".pdf"]')

要仅在点击时显示pdf链接，您可以隐藏所有链接，然后只显示pdf链接：

/*** Onload Event, so it waits until stuff actually exist ***/
$(function(){
    $('#myBtn').click(function() {
        /*** $().hide basically adds a display:none to the element. Hides all links in div. ***/
        $('#links > a').hide();

        /*** Opposite of $().hide(); Applied to PDF links ***/
        $('#links > a[href$=".pdf"]').show();
    });
});

jQuery Selectors Reference

在jQuery中挑选出类型的链接

2 个答案: