Open select2 on focus

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://select2.github.io/dist/js/select2.full.js"></script>
<link rel="stylesheet" href="https://select2.github.io/dist/css/select2.min.css">
<div class="container">
    <div class="row">
        <div class="col-md-12">
             <h1 class="h3">Open select2 on focus</h1>

            <p>Click on the email input then use tab to change to select2 field. You will notice that select2 dropdown doesn't open.</p>
            <form action="#">
                <label for="exampleInputEmail1">Email address</label>
                <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email">
                <br>
                <label for="select2">Here is select2</label>
                <select class="form-control js-select" multiple="multiple">
                    <option value="1">Option A</option>
                    <option value="2">Option B</option>
                    <option value="3">Option C</option>
                </select>
            </form>
        </div>
    </div>
</div>

JavaScript

$('.js-select').select2({
    placeholder: "Select",
    width: "100%"
})

	// Make Select2 respect tab focus
	function select2Focus(){
		jQuery(window).keyup(function (e) {
			var code = (e.keyCode ? e.keyCode : e.which);
			if (code == 9 && jQuery('.select2-search__field:focus').length) {
				jQuery('.js-select').select2('open');
			}
		});
	}
	select2Focus();