CODEWITHSUNDEEP
javascriptjquery
reectrix
reectrix

Reputation: 8629

Setting the value/text of event.target with jQuery

I have the following HTML:

<a class="small" href="/comments/new">Write New Comment</a>

And the following js:

$(document).ready(function () {                                               
   $('.comment > a').click( function (event) {                                
         var url = event.target.href                                          
         $('.comment_area').load(url)                                         
          **event.target.text = ""**
          event.preventDefault()                                              
       })                                                                     
   })

I am trying to set the text of the link to blank, but can't seem to find a way to do this. I've also tried:

event.target.text("")
event.target.value = ""

and none of these work. Is this even possible to do from the JavaScript side?

Upvotes: 1

Views: 25685

Answers (5)

mcolo
mcolo

Reputation: 136

Do you mean so it disappears? You could do:

$(this).hide();

or

$(this).text("");

Upvotes: 0

Venkata Krishna
Venkata Krishna

Reputation: 15112

You could simply use this. 

$('.comment > a').click( function (event) {
    $(this).text(""); 

    //Other stuff
});

You don't have to use event.target

this refers to the element which you have attached the event. In your case, $('.comment > a')

If you have multiple anchor links directly under the container .comment, it helps to differentiate between them & you could do specific things with each of those anchor links.

Upvotes: 4

Karl-Andr&#233; Gagnon
Karl-Andr&#233; Gagnon

Reputation: 33870

Try :

event.target.innerHTML = "";

or 

event.currentTarget.innerHTML = "";

or

this.innerHTML = "";

event.target is the very first element on the top of the DOM. It mean that if there is a span in your a, the span will be selected.

That's why using currentTarget is safer since it is the element on which the event is binded.

this by default is the same as currentTarget but this value can be altered by .apply(), .call() or .bind.

Upvotes: 0

Riccardo Zorn
Riccardo Zorn

Reputation: 5615

You're using jQuery so why stick with Javascript alone?

$(document).ready(function () {                                               
   $('.comment > a').click( function (event) {                                
         $this = $(this);
         var url = $this.attr('href');
         $('.comment_area').load(url)                                         
          $this.text("");
          event.preventDefault()                                              
       })                                                                     
   })

This will save you the headaches of different event structure in different browsers

Upvotes: 0

Afzaal Ahmad Zeeshan
Afzaal Ahmad Zeeshan

Reputation: 15860

To set the text to blank use this method .text('').

So, you method would change to the following one:

$(document).ready(function () {                                               
   $('.comment > a').click( function (event) {                                
      var url = event.target.href;
      // this can be replaced by the following
      var url = $(this).attr('href');
      $('.comment_area').load(url);                       
      $(this).text(''); // empty the current string
      event.preventDefault();
   });
});

It is better practice to add ; at the end of the code lines! :)

Upvotes: 0

Related Questions