Использование javascript, чтобы изображение работало как кнопка изменения размера шрифта

Question

Вот что у меня есть сейчас, но кнопки все еще не изменяют размер текста. У меня есть значение для каждой кнопки, установленной для 0.1 и -0.1 соответственно, а размер шрифта в настоящее время установлен на 1em. Есть идеи?

window.onload = startup; 

function startup() { 
    var fontButtons = document.getElementsByClassName("fontsizer"); 
    var i; 
    alert(fontButtons.length); 
    for (i = 0; i < fontButtons.length; i++) 
fontButtons[i].onclick = function(){resizeText(this)}; 
} 

function resizeText() { 
    var fontChange; 
    fontChange = parseFloat(objButton.value); 

    if (document.body.style.fontSize == "") { 
     document.body.style.fontSize = "1.0em"; 
    } 

    var currentFontSize; 
    alert("changed"); 
    currentFontSize = parseFloat(document.body.style.fontSize); 
    currentFontSize = currentFontSize+fontChange; 
    document.body.style.fontSize = "currentFontSize+em" 
} 

Answer 1

Для вызова функции с параметрами из onclick, поместить его в анонимную функцию так:

fontButtons[i].onclick = resizeText(this);

становится:

fontButtons[i].onclick = function(){resizeText(this)};

Кроме того, убедитесь, что вы запустите startup() после .fontsizer элементов. например window.onload = startup; или что-то подобное, которые вы можете запустить, если:

document.onreadystatechange = function() { 
    if (document.readyState !== 'complete') 
     return; 

    startup(); 
} 

работает скрипку: https://jsfiddle.net/ckn9sLfv/

Answer 2

fontButtons[i].onclick = resizeText; // not (this); 

Вы должны назначить функцию, а не возвращаемое значение (не определено).