How to have single click and double click on the same element using AddEventListener?

1

I need to have single-click and double-click event handlers on the same element. How to do this using the AddEventListener()?

Javascript seems to interpret the double-click event as two single-click events and firing the click event twice. How to have Javascript correctly interpret the double-click event?

for (let i = 1; i < trs.length; i++) {


  trs[i].addEventListener('click', function(event) {

    var record = kintone.app.record.get();
    var newRow = {
      value: {
        "company": {
          type: "SINGLE_LINE_TEXT",
          value: this.children[0].innerText
        },
        "modelno": {
          type: "SINGLE_LINE_TEXT",
          value: this.children[1].innerText
        },
        "serialno": {
          type: "SINGLE_LINE_TEXT",
          value: this.children[2].innerText
        },
        "notes": {
          type: "SINGLE_LINE_TEXT",
          value: ""
        }
      }
    };

    record.record['machinesselected']['value'].unshift(newRow);
    kintone.app.record.set(record);

  }); // addEventListener click


  trs[i].addEventListener('dblclick', function(event) {

    var record = kintone.app.record.get();
    alert(this.children[0].innerText + this.children[1].innerText + this.children[2].innerText);
    kintone.app.record.set(record);

  }); // addEventListener dbclick      

} // for
2

Hello annaylee,

First of all, as you might already know, there is no event in Kintone that is related to the mouse click.
The following is one of the many simple methods to obtain both single and double click events:

var clicked = false;
document.getElementById("clicktrigger").onclick = function (evt) {
    if (clicked) {
        alert("double click!!");

        clicked = false;
        return;
    }

    clicked = true;
    setTimeout(function () {
        if (clicked) {
            alert("single click!");
        }

        clicked = false;
    }, 300);
};

I hope this helps.

Best,
Chris