EasyUI Forum

I have the following html:
<div class="col-md-3">
          <div class="form-group">
            <input class="easyui-timespinner form-control" style="width:100%;" id="ROL_DUR" label="Arbeitszeit:" labelPosition="top" required>
            <div class="invalid-feedback">Geben Sie die Dauer der Durchführung ein!</div>
            <!-- <div class="valid-feedback">Die Dauer der Durchführung wurde eingetragen</div> -->
          </div>
        </div>

in js I tried this:
 $('#ROL_DUR').timespinner({
         showSeconds: false
        ,value: ''
      });

    const cInputROL_DUR = $('#ROL_DUR').timespinner('textbox');
    console.log("textbox type:", cInputROL_DUR.prop("tagName"), "id:", cInputROL_DUR.attr("id"));
    console.log("--- cInputROL_DUR - length: " + cInputROL_DUR.length);

    if (cInputROL_DUR.length) {
      $('#ROL_DUR').timespinner('textbox').on('blur', function() {

        console.log(">>> blur handler wurde getriggert"); // Test

        const newValue = $('#ROL_DUR').timespinner('getValue');
        console.log("--- blur on ROL_DUR: " + newValue);

and this:

const realInput = $('#ROL_DUR').timespinner('textbox')[0]; // echtes <input>
if (realInput) {
  realInput.addEventListener('blur', function() {
    const newValue = $('#ROL_DUR').timespinner('getValue');
    console.log(">>> blur feuert! Wert:", newValue);

nothing works.

How can I implement a eventListener when the field is left by the cursor?