Javascript:使用for循环添加EventListeners

时间:2019-11-29 14:56:02

标签: javascript addeventlistener

嗨,我试图通过一个for循环将EventListeners添加到多个按钮,但是它变得混乱起来,我被迫为每个按钮编写重复的函数。

  let COLUMNS = ["ID", "FNA", "FND", ...];

  // Sorting
  let ORDER_BY = "ID";
  let ORDERING = "ASC";

  function setOrdering(column, option) {
    ORDER_BY = column;
    ORDERING = option;
  } 

  // DOESNT WORK
  function addSortingEventListeners() {
    for (column of COLUMNS) {
      document.querySelector('#btnSort'+column+'Asc').addEventListener('click', () => {
        setOrdering(column, 'ASC');
        createSFP();
      });
      document.querySelector('#btnSort'+column+'Desc').addEventListener('click', () => {
        setOrdering(column, 'DESC');
        createSFP();
      });
    }
  }
  addSortingEventListeners();


  // This repetitive functions work.
  btnSortIDAsc.addEventListener('click', () => {
    setOrdering('ID', 'ASC');
    createSFP();
  });
  btnSortIDDesc.addEventListener('click', () => {
    setOrdering('ID', 'DESC');
    createSFP();
  });

0 个答案:

没有答案