https://codepen.io/anon/pen/LMMEqP witam czemu mi to nie działa, dodam , że na wpisanie na sztywno px działa.
0
1
Zrób tak
const p = document.querySelector('#para');
const but = document.querySelector('button');
let f = getFontSize();
function getFontSize(){
return document.querySelector('#font').value;
}
but.addEventListener('click', function () {
p.style.fontSize = getFontSize() + "px";
});
Dodałem Ci tam funkcję - bo może będziesz chciał korzystać kiedyś ze zmiennej f. Jeśli nie będziesz korzystał, to możesz wywalić funkcję i bezpośrednio w listenerze pobierać value z tego inputa.
Ogólnie Twój błąd polegał na tym, że wartość z inputa pobierałes tylko raz (za pierwszym wywołaniem kodu, a nie na clicku), a na evencie ona nie zmieniała się. Input #font nie miał domyslnej wartości - dlatego Ci wcale nic nie działało.
1
Jeśli zmienna f nie będzie Ci wcale potrzebna to jej nie robisz i w eventListenerze dajesz
p.style.fontSize = document.querySelector('#font').value + "px"
, a wartość domyślną to już ustawiasz raczej normalnie poprzez value dla samego inputa w htmlu.
1
albo w ulubionym jquery
http://jsfiddle.net/tpwo5eg1/