jquery/javascript dodawanie atrybutów

Question

kod: https://codepen.io/FoxCode/pen/ZBrPKq
Witam, chciałbym, żeby po podwójnym kliknięciu na element h1 tylko h1 był edytowalny, a po kliknięciu paragrafu tylko paragraf. Jak to zrobić bez oddzielnego tworzenia tego samego kodu i zmieniania tylko
$( " ELEMENT TUTAJ " ).dblclick(function() { [...] };
Można to jakiś zrobić przez this? Tj. jeżeli 'this' został wciśnięty dostaje atrybut contenteditable

Answer 1

Nie chodziło ci o coś takiego: https://codepen.io/anon/pen/ENQzBd

Btw, do togglowania dataset: https://codepen.io/anon/pen/yVvdVE

Answer 2

Możesz każdemu elementowi HTML, który ma być edytowalny nadać atrybut name="editable"

W JS sobie łapiesz wszystkie elementy o tym atrybucie i tworzysz z nich tablicę. Na zdarzenie dblclick ustawiasz wszystkim elementom pole contentEditable na false, po czym elementowi, który wywołał zdarzenie (event.target) ustawiasz contentEditable na true.

https://codepen.io/ChrissP92/pen/RoQOox?editors=1010

Comments

editable.forEach(function(elem){elem.contentEditable = false});

Aż się prosi o arrow function

---

btw do customowych atrybutów używa się dataset - name nie jest atrybutem globalnym

Answer 3

Witam.

codepen

Comments

1. Po co to onlaod?
2. addEventListener vs on*
3. Nie mieszaj warstw -> CSSa wywal do CSSa - w JS podmieniaj tylko klasy
4. Nazewnictwo zmiennych w Twoim kodzie powinno lepiej opisywać ich przeznaczenie

---

To jest wskazówka na zadanie pytanie.