CODEWITHSUNDEEP
javascriptjquery
user267595
user267595

Reputation: 41

jquery , how do i select attr href target hide

$('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?

Upvotes: 2

Views: 1139

Answers (6)

Kyle Trauberman
Kyle Trauberman

Reputation: 25684

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();
});

Upvotes: 0

user267599
user267599

Reputation: 789

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>

Upvotes: 0

Anthony
Anthony

Reputation: 37065

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?

Upvotes: 1

rahul
rahul

Reputation: 187060

Enclose your anchor tag event hanlder in document ready function.

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

Upvotes: 0

mr.b
mr.b

Reputation: 2708

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

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

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

Upvotes: 0

womp
womp

Reputation: 116977

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', '');

Upvotes: 0

Related Questions