CODEWITHSUNDEEP
html
shadowbudz
shadowbudz

Reputation: 241

How to exclude an element when using a link

I have an issue right now and i am curious if there is a possible way to solve this. I have 2 div's enclosed in href elements. The problem is that i want to exclude the <p> element. Is there a way to do this despite it being inside the href element? Thanks.

<a href= "sample.com">
  <div class="1">
    <p>Hello</p>
   </div>
</a>
<a href= "test.com">
  <div class="2">
    <p>Hello</p>
  </div>
</a>

Upvotes: 2

Views: 3205

Answers (2)

jmore009
jmore009

Reputation: 12923

Yes you can but I wouldn't advocate for it.

You could use CSS to remove the appearance of a link:

a{
  text-decoration: none;
}

p{
  cursor: default;
  color: #000;
}

Then you could use preventDefault() to prevent the p from triggering the action on click:

$("p").click(function(e){
   e.preventDefault();
});

FIDDLE

What you really should do is add another wrapper to contain your elements and then wrap your div with an a like so:

<div class="wrapper">
  <a href="http://www.google.com" target="_blank">
     <div class="1"></div>
  </a>
  <p>Hello</p>
</div>

Upvotes: 5

jay.jivani
jay.jivani

Reputation: 1574

$(function(){
  $('p').click(function(){
    alert($(this).attr('href'));
    // or alert($(this).hash();
  });
});

Upvotes: 0

Related Questions