JSFiddle - React, Tailwind, and code Playground

by olragon

HTML

<link rel="stylesheet" href="http://ivaynberg.github.io/select2/select2-master/select2.css">
<script src="http://ivaynberg.github.io/select2/select2-master/select2.js"></script>
    <h1>Search Form</h1>
    <form style="margin-left: 200px;">
        <select id="s" style="width:200px">
            <option>Test</option>
        </select>
        <select id="o">
        </select>
    </form>

JavaScript

$(function(){
    var box = $('#s');
    var select = $('#o');
    
    for(var i = 0; i < 5000; i++) {
        var option = '<option><a href="#">Test'+ i +'</a></option>';
        box.append(option);
        select.append(option);
    }
    var start = null;
    box.on('select2-focus', function() {
      start = new Date().getTime();
      console.log('Start ', start, 'ms'); 
    });
    box.on('select2-open', function() {
      console.log('Run time ', new Date().getTime() - start, 'ms');   
    });
    box.on('select2-focusout', function() {
      start = null;
      console.log('End'); 
    });
    box.select2(); 
});