I am trying to get an attribute from the child of the the currentTarget. I have tried this, (e.currentTarget.child.attr("data-english")

I have googled it and have had no luck finding anything useful, maybe its me being new with code I might be looking up the wrong thing.

Here is the HTML

 < select class="form-control" id="select_fundFamily"     name="select_fundFamily" autoplete="off" >
  < option value="stuff" data-english="english" data-family-locallang="model" >

At the moment in JQuery, the e.currentTarget.value; is showing the select element.

Can someone please kindly advise me in what path to take to solve this issue?

I am trying to get an attribute from the child of the the currentTarget. I have tried this, (e.currentTarget.child.attr("data-english")

I have googled it and have had no luck finding anything useful, maybe its me being new with code I might be looking up the wrong thing.

Here is the HTML

 < select class="form-control" id="select_fundFamily"     name="select_fundFamily" autoplete="off" >
  < option value="stuff" data-english="english" data-family-locallang="model" >

At the moment in JQuery, the e.currentTarget.value; is showing the select element.

Can someone please kindly advise me in what path to take to solve this issue?

• javascript
• jquery

Share Improve this question Follow edited Sep 4, 2023 at 4:00 Henry Ecker♦ 35.7k1919 gold badges4747 silver badges6464 bronze badges asked Jun 10, 2015 at 19:59 user3457760user3457760 33711 gold badge44 silver badges1212 bronze badges 0

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 6

For the value of the selected option in a select, you can use

$(e.currentTarget).find(':selected').attr("data-english");

Run the snippet below to see it work

$(document).ready(function(){
    $('select').change(function(e){
         var eng = $(e.currentTarget).find(':selected').attr("data-english");
        $('body').append(eng);
    })
});

<script src="https://ajax.googleapis./ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="select_fundFamily"> 
    <option selected disabled>Select something</option>
    <option value="stuff1" data-english="english1" >1</option>
    <option value="stuff2" data-english="english2" >2</option>
    <option value="stuff3" data-english="english3" >3</option>
    <option value="stuff4" data-english="english4" >4</option>
    <option value="stuff5" data-english="english5" >5</option>
</select>

If you try to determine the selected option's attribute. A simple solution is:

var dataEnglish = $('#select_fundFamily option:selected').attr('data-english'); // dataEnglish = english

currentTarget will respond any element that event listener triggered the event. In your case, i think you want to use e.target to target the right element.

$("select#select_fundFamily").on('click','option', function(e) {
    e.preventDefault();
    $(e.target).attr('data-english'); // you can use $(this) instead
    //something else
});