jquery , how do i select attr href target hide

Question

$('a.minimize').click(function() {
$($(this).attr('href')).hide();
});

<div class="drag" id="2">

<a href="#content" class="minimize" style="display: none;">2</a></p>
    <div id="content">1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br /></div>
</div>

i want to hide the #content by set the a href="" , why is not work???

any mistake?

Answer 1

hide() is not the right function to use on an attribute. It is used to set the visibility of DOM elements.

Try this instead:

$(this).attr('href', '');

Answer 2

.hide() is different. You should have it like this.

$(this).attr('attr','value here')

$($(this).attr('href',''));

Answer 3

Enclose your anchor tag event hanlder in document ready function.

$(function(){
    $('a.minimize').click(function() {
        $($(this).attr('href')).hide();
    });
});

Answer 4

What your wanting is really unclear, at least to me. The answers you've gotten are right, in that if you want the href attribute to be empty, you don't use hide. But here is where I'm confused:

1. You already have display:none set for that <a>, so that means it won't appear at all. So how is a user going to click on something they can't interact with?

2. You are wanting to "hide" the <a> AFTER it gets clicked. If I had to guess you either want to:

   a. Make the link (with the 2 that's showing) go away after the user clicks it, or b. You want the user to only click on the link once, and after that, it becomes a dead link because it doesn't point to anything.

So, assuming I have the faintest idea of what you are going for, to make the link dead on click, follow the advice already given

 $('a.minimize').click(function() {
      $(this).attr('href', ''); 
 });

If you want the link to evaporate on click, go with:

 $('a.minimize').click(function() {
      $(this).hide(); 
 });  

Or am I totally missing the point?

Answer 5

well.. from where to start.. first of all that wont ever work if you dont show the clickable element. so you would have to remove the style="display:none" like this:

<div class="drag" id="2">

<a href="#content" class="minimize" >2</a></p>
    <div id="content">1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br /></div>
</div>

second. the javascript wont ever work if you dont put in on script tags. and last and most important you cant try to get the element a.minimize before the browser load it. So you shold either or execute the script after the html of the element it's output or do it safely with the ready event of the element jQuery(document). so here is the code working:

<script>

jQuery(document).ready(function(){
$('a.minimize').click(function() {

$($(this).attr('href')).hide();
});
});
</script>

<div class="drag" id="2">

<a href="#content" class="minimize" >2</a></p>
    <div id="content">1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br />1<br /></div>
</div>

Answer 6

If I understand you correctly, you want to hide the div with the id of 'content' when you click the link with class 'minimize'.

This is the correct way to do it:

$("a.minimize").click(function() {
    $("#content").hide();
});

Or, if you want to toggle the status of the div with the id of 'content' when the link is clicked, try this:

$("a.minimize").click(function() {
    $("#content").toggle();
});

Answer 7

$(function() {
    $('a.maximize').click(function() {
        $($(this).attr('href')).animate({
        position: "absolute",
        top: 0,
        left: 0,
        height: '99.5%',
        width: '99.5%',
        opacity: 1,
  },1000)
});
});
$(function() {
    $('a.minimize').click(function() {
        $($(this).attr('href')).slideToggle();
});
});

this is my code , but why no function after click the a.maximize