How to get the specific id of an input which the user did key up on it

Question

I got a form with some text inputs and one select options, and i want to alert the input id when user is preforming key up event or change selection in the select options.

whats the best way to do it? right now i am writing a function for each one :(

my bad code so far :

$( "#target" ).keyup(function() {
alert( this.id );
});

this my form:

<form>
<div class="col-md-6">
<div class="form-group">
  <input type="text" class="form-control input-lg" name="FirstName" id="FirstName" placeholder="First Name" maxlength="45" required="">
</div>
</div>
<div class="col-md-6">
<div class="form-group">
  <input type="text" class="form-control input-lg" name="LastName" id="LastName" maxlength="45" placeholder="Last Name" required="">
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
  <input type="email" class="form-control input-lg" name="Email" id="Email" maxlength="255" placeholder="Email Address" required="">
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
  <input type="password" id="Password" name="Password" maxlength="32" class="form-control input-lg" placeholder="Password" required="">
</div>
</div>
<div class="col-sm-12">
<div class="form-group">
  <select id="countryData" class="form-control bfh-countries" data-country="US">
    <option value=""></option>
    <option value="AF">Afghanistan</option>
    <option value="BR">Brazil</option>
  </select>
 </div>
 </div>
</form>

Answer 1

You may use input event for input fields and change event for select fields:

$(function () {
  $("input").on('input', function() {
    console.log( this.id );
  });
  $("select").on('change', function() {
    console.log( this.id );
  });
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<form>
    <div class="col-md-6">
        <div class="form-group">
            <input type="text" class="form-control input-lg" name="FirstName" id="FirstName" placeholder="First Name" maxlength="45" required="">
        </div>
    </div>
    <div class="col-md-6">
        <div class="form-group">
            <input type="text" class="form-control input-lg" name="LastName" id="LastName" maxlength="45" placeholder="Last Name" required="">
        </div>
    </div>
    <div class="col-sm-12">
        <div class="form-group">
            <input type="email" class="form-control input-lg" name="Email" id="Email" maxlength="255" placeholder="Email Address" required="">
        </div>
    </div>
    <div class="col-sm-12">
        <div class="form-group">
            <input type="password" id="Password" name="Password" maxlength="32" class="form-control input-lg" placeholder="Password" required="">
        </div>
    </div>
    <div class="col-sm-12">
        <div class="form-group">
            <select id="countryData" class="form-control bfh-countries" data-country="US">
                <option value=""></option>
                <option value="AF">Afghanistan</option>
                <option value="BR">Brazil</option>
            </select>
        </div>
    </div>
</form>