Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript jQuery Basics Working with jQuery Collections Changing Element Properties

Carlos Lantigua
Carlos Lantigua
5,938 Points
Posted by Carlos Lantigua
Carlos Lantigua
5,938 Points

JQuery Attr method for download not working : (

Trying to turn the pdf file for JQuery Cheatsheet into a download and it does not seem to be working, it still just opens the pdf in a separate tab.

<div id="links">
        <ul>
            <li><a href='https://learn.jquery.com/'>Learn jQuery</a></li>
            <li><a href='http://treehouse-project-downloads.s3.amazonaws.com/jquery-basics/jquery_cheatsheet.pdf' download>jQuery Cheatsheet</a></li>
            <li><a href='https://api.jquery.com/'>jQuery Documentation</a></li>
            <li><a href='https://developer.mozilla.org/en-US/docs/Glossary/jQuery'>jQuery Glossary</a></li>
        </ul>
        <label><input type='checkbox'> Allow PDF downloads</label>
    </div>

```JQuery

const $odd = $('a:odd'); //selects all odd anchor elements
const $secureLinks = $('a[href^="https://"]');
const $pdfs = $('a[href$=".pdf"]');

$secureLinks.attr('target', '_blank');
$pdfs.attr('download', true);

6 Answers

Alan McClenaghan
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Alan McClenaghan
Full Stack JavaScript Techdegree Graduate 56,501 Points
Alan McClenaghan
.a{fill-rule:evenodd;}techdegree seal-36
Alan McClenaghan
Full Stack JavaScript Techdegree Graduate 56,501 Points

This seems to be more of a browser setting issue: Follow these steps for Chrome on a Mac:

  1. Open Google Chrome.
  2. Click on the Menu icon (Google Chrome Menu icon) in the top-right corner of the Window.
  3. Click Settings.
  4. Scroll down to the bottom of the Settings window and click Advanced.
  5. In the Privacy and security section, click Content Settings.
  6. Scroll down and click the PDF documents option.

Check out https://www.computerhope.com/issues/ch001114.htm for preferences in other browsers.

Ryan Pierson
Ryan Pierson
14,365 Points

Thanks Alan!

Charles Tillmon
Charles Tillmon
33,364 Points

Thanks Alan! I was scratching my head on this one

Ariful Hoque
Ariful Hoque
3,700 Points
Ariful Hoque
Ariful Hoque
3,700 Points

thanks Alan for the help. This saved me some time.

Emilia Jacaszek
Emilia Jacaszek
3,003 Points
Emilia Jacaszek
Emilia Jacaszek
3,003 Points

Thank you, download works now !

rhupp
rhupp
11,019 Points

Brilliant!

Luis Ortiz Hinojosa
Luis Ortiz Hinojosa
4,482 Points
Luis Ortiz Hinojosa
Luis Ortiz Hinojosa
4,482 Points

Hey Carlos, did you ever get it to work? I also wasn't able to download the file

Carlos Lantigua
Carlos Lantigua
5,938 Points
Carlos Lantigua
Carlos Lantigua
5,938 Points

No I was not, had to move on. Sorry : (

shashi7
shashi7
11,034 Points
shashi7
shashi7
11,034 Points

I can't download either...phew!!

James March
James March
7,921 Points
James March
James March
7,921 Points

Changing preferences worked for me too, nothing wrong with the code thankfully

Jennifer Nordell
seal-mask
STAFF
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher
Jennifer Nordell
.a{fill-rule:evenodd;}techdegree
Jennifer Nordell
Treehouse Teacher

Hi there, Carlos! This is tricky to answer because I'm not sure if that final backtick in your code was part of your markdown or not. If it's actually part of your code, then it will cause an error. If it's part of your markdown and not in your code, then the problem is elsewhere. I took your code and pasted it into the workspace and other than that one backtick, it works for me.

So here are a few things to check:

  • Make sure you've saved your work. We all forget sometimes.
  • Try refreshing the page
  • Make sure you've checked "Allow PDF downloads"
  • If none of this is working, you might try deleting your browser cache because it could be loading in older data instead of your new code.

Hope this helps, but let me know if there are still issues! :sparkles:

Carlos Lantigua
Carlos Lantigua
5,938 Points
Carlos Lantigua
Carlos Lantigua
5,938 Points

Thank you for the reply, the back tick is an attempt on my part to quote the code lol. The link is still directing me to view the pdf rather than download the file. At this point in the video it should allow the user to download on click without checking the box as that feature is supposed to be added in the next video. I have tried chrome and firefox, I'm probably misspelling something some where and just can't see it.

Chris Komaroff
PLUS
Chris Komaroff
Courses Plus Student 14,198 Points
Chris Komaroff
Chris Komaroff
Courses Plus Student 14,198 Points

All I am able to do for Chrome is drill down to settings | advanced | privacy and security | content settings | Download PDF files instead of automatically opening them in Chrome = Yes / turn on. But of course this is silly because all PDFs download automatically anyway such that I don't need to use the download attribute in the first place. I don't think the anchor tag download attribute is ready for prime time. It sounded like a weird attribute to me when Treasure used it as an example.