Rabin Lama Dong
Rabin Lama Dong

Reputation: 2476

Bind event only on the parent element

I have this html data:

<select class="select">
    <option>a</option>
    <option>b</option>
    <option>c</option>
</select>

How do I bind an event only when I click the select element shown in the page, not when the option elements are clicked. I don't want to bind event on the items that are in the dropdown.

Update: I did found this one post. But it does not work for my case.

Upvotes: 0

Views: 131

Answers (3)

Himanshu Upadhyay
Himanshu Upadhyay

Reputation: 6565

try :

$('select').focus(function(){...}); 

or

$('select').click(function(){...}); 

Upvotes: 0

lalithkumar
lalithkumar

Reputation: 3530

Try this:

$(function(){
$('select').on('focus',function(){
console.log($(this).val());
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="select">
    <option>a</option>
    <option>b</option>
    <option>c</option>
</select>

Upvotes: 1

Rabin Lama Dong
Rabin Lama Dong

Reputation: 2476

This does the job for now.

$('.select').on('focus', function() {
    //code here
});

But I'm not sure if it is good for long run.

Upvotes: 0

Related Questions