js, addeventlistener z funkcją ze stringa

mam sobie string

Kod:

---

var xd = 'document.getElementsByTagName("input")[0].value = "123";document.getElementsByTagName("input")[1].value = "321";';

---

a dokładniej jakąś funkcję zapisaną jako string, normalnie jak bym chciał to wywołać użyłbym eval(), natomiast jak użyć tego stringu (funkcji) jako parametr listener'a?

mam sobie

Kod:

---

document.getElementById('b1').addEventListener('click', cotuwpisac?, false);

---

generalnie to mam sobie tablicę ze stringami "funkcji", którą to pobieram sobie $.get'em i chciałbym to pętlą/$.each'em zrobić tak, żeby każdą z każdej funkcji (stringu - elementu tablicy) stworzyło mi listenera z daną funkcją (troche masło maślane, ale chyba wiadomo o co chodzi)

coś w stylu

Kod:

---

document.getElementById('b1').addEventListener('click', eval(xd), false);

---

nie działa, bo automatycznie mi wykonuje tego evala po wrzuceniu tego w konsole xd

boże jakie to proste było... eh można skasować

document.getElementById('b1').addEventListener('cl ick', function(){eval(xd)}, false); ;/

mozesz zrobic troche lepiej, tj. oszczedzic przy kazdym wywolaniu eventa calla do eval (a wiec parsowania kodu, co jest dosc kosztowne).

Kod:

---

const code = "alert('foo')"
const node = document.getElementById(...)
node.addEventListener('click', new Function(code))

---

co jest rownoznaczne z

Kod:

---

const fun = () => { alert('foo') }
const node = document.getElementById(...)
node.addEventListener('click', fun)

---

mozesz dla tak stworzonej funkcji rowniez zdefiniowac parametry. w tym wypadku przydatne moze byc przyjmowanie MouseEvent.

Kod:

---

const code = 'alert(`${e.clientX} ${e.clientY}`)'
const node = document.getElementById(...)
node.addEventListener('click', new Function('e', code))

---

rownoznaczne z

Kod:

---

const fun = e => { alert(`${e.clientX} ${e.clientY}`) }
const node = document.getElementById(...)
node.addEventListener('click', fun)

---

po kliknieciu na `node` wyskoczy alert z wspolrzednymi kursora.

wiecej info na MDN: https://developer.mozilla.org/en-US/...jects/Function

oo dziękować :)