Onclick clear не работает

Question

Есть такая функция очистки полей на форме

function clear(){

console.log("clear!");

var inputs = document.querySelectorAll('input[type = text]');

for (var i = 0; i< inputs.length; i++) inputs[i].value = "";
}

Подключаю ее так

tr>
    <td><input type="button" name="" value="ce" onclick="clear()"></td>
    <td><input type="button" name="" value="calculate" onclick="calculate()"></td>
</tr>

Но она почему-то не хочет вызываться по нажатию на кнопку. При этом вторая функция моего скрипта calculate() работает. Почему так происходит? В чем может быть причина такого странного поведения? Вот скриншот консоли после нажатия кнопок. calculate() вызвалась, а clear() нет!

Answer 1

clear() Плохое название функции... поменял — все заработало.

Answer 2

clear - не плохое название функции. Плохо до сих пор использовать onclick в HTML. В этом случае, JS ищет функцию с соответствующим названием сначала в объекте document, потом у window. И не доходит до объявленного вами clear, а берет встроенный document.clear (deprecated).

function clear() { return 0; }

console.log('window?', clear === window.clear );
console.log(clear);

<button onclick="console.log('doc?', clear === document.clear); console.log(clear)"> TEST </button>

Решение: Всё писать прямо в скрипте:

let btn = document.getElementById("btn");

btn.addEventListener('click', clear);
btn.addEventListener('click', function() {
  console.log("Можно и так");
});

function clear() {
  console.log("ok");
}

<button id="btn"> TEST </button>

БЛОГ НА HUSL

Onclick clear не работает

Ответы (2 шт):