CODEWITHSUNDEEP
javascriptinput
user3007294
user3007294

Reputation: 951

Click event on input value

I am trying to alert '#water' when I click the text '#water'. Instead I am getting 'Object Object'. Am I completely missing the boat here? The idea is that if there are multiple values, say "#water", "#tea", "soda", that you can click each text individually rather than just triggering the event by clicking the text area. 

   <input type='text' id='input-tags' name='hashtags' value="#water">

   <script>
     $('#input-tags').click(function(){
       alert($(this))
     })
   </script>

Upvotes: 0

Views: 40

Answers (3)

Muhammad Ali
Muhammad Ali

Reputation: 2014

<script>
  $('#input-tags').click(function(){
   alert($(this).val())
 })
</script>

Upvotes: 1

SVSchmidt
SVSchmidt

Reputation: 6567

jQuerys Sizzle (the engine used for selecting things) does not return the HTMLObject (<input type='text' ...>) but a jQuery Object:

[input#input-tags, context: input#input-tags, jquery: "1.11.0", constructor: function, selector: "", toArray: function…]
0: input#input-tags
context: input#input-tags
length: 1
__proto__: Object[0]

To shorten things: The correct way of getting #water is either

$(this).val()

(http://api.jquery.com/val/) or

$(this)[0].value

since $(this)[0] represents the HTMLObject.

Upvotes: 0

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114437

$(this) is a reference to the object. You're getting the expected behaviour.

If you want to see what the input holds, use $(this).val();

Upvotes: 3

Related Questions