Как сделать так чтобы данная кнопка не перщагружала страницу

Noit

Хтмл код:
<div id="containerRegister" class="tabContainerReg">
      <form method="post" action="">
        <h2 class="loginTitle">Регистрация</h2>
        <div class="registerContent">
          <div class="inputWrapper">
            <input type="text" id="name" placeholder="Ваше имя" />
          </div>
          <div class="inputWrapper">
            <input type="text" id="femail" placeholder="Ваша фамилия" />
          </div>
          <div class="inputWrapper">
            <input type="text" id="login" placeholder="Ваш логин" />
          </div>
          <div class="inputWrapper">
            <input type="password" id="password" placeholder="Ваш пароль"/>
          </div>
          <div class="inputWrapper">
            <input type="password" id="password2" placeholder="Повторите пароль"/>
          </div>
          <div class="inputWrapper">
            <input type="text" id="email" placeholder="Ваш email"/>
          </div>          
          <div class="inputWrapper">
            <input type="radio" class="radio" name="sex" value="man"> Мужской
            <input type="radio" class="radio" name="sex" value="women"> Женский
            <input type="radio" class="radio" checked="checked" name="sex" value="nlo"> Неопределился
          </div>
          <div class="inputWrapperCheck">
            <input type="checkbox" class="checkbox" name="interes" value="chck1"> есть интересы
            <input type="checkbox" class="checkbox" name="interes" value="chck2"> нет интересов
            <input type="checkbox" class="checkbox" name="interes" value="chck3"> много интересов
            <input type="checkbox" class="checkbox" name="interes" value="chck4"> мало интересов
            <input type="checkbox" class="checkbox" name="interes" value="chck5"> секрет
            <input type="checkbox" class="checkbox" name="interes" value="chck6"> не секрет
          </div>
        </div>
        <button class="clearBox" onclick="return clear()">Очистить</button>
        <button class="greenBox" onclick="return check()"> Зарегистрироваться</button>
      </form>
    </div>
JS Код:
function clear(){
 
    var name = document.getElementById('name');
    var femail = document.getElementById('femail');
    var login = document.getElementById('login');
    var password = document.getElementById('password');  
    var password2 = document.getElementById('password2');       
    var email = document.getElementById('email'); 
 
    name.value="";
    femail.value="";
    login.value="";
    password.value="";
    password2.value="";
    email.value="";
 
    return true;
}
При нажатии на кнопку "Очистить" перезагружается страница, а хотелось, бы чтобы сразу чистились все поля без перезагрузки.
3 ответа

Noit

Поменяйте название функции на другое (например clears) и сделайте так:
<button class="clearBox" onclick="clears();return false;">Очистить</button>
Ну и соотв в js тоже надо название функции поменять


Noit

Благодарю, хотелось бы узнать в чем была моя ошибка?


Noit

Благодарю, хотелось бы узнать в чем была моя ошибка?
При клике по кнопке происходит стандартное действие браузера по умолчанию - перезагрузка страницы. Отменить ее можно либо возвратив false от функции обработчика (у вас наоборот true стояло). Таже можно перехватить объект события и вызвать у него метод preventDefault() (работать будет аналогично для ваших целей). Само имя функции clear использовать не получится в контексте обработчика. Cамо слово clear не является зарезервированным в javascript. Но существует метод обекта document - document.clear. Убедиться, что в области видимости обработчика события в качестве атрибута присутствует объект document можно так:
<button class="clearBox" onclick="console.log(clear === document.clear);">Очистить</button> // true
то есть объкт document в данном случае идет раньше в цепочке областей видимости: (JavaScript: The Definitive Guide)
In an event handler as HTML attribute, the Document object is in the scope chain before the Window object (...)
Таким образом так в данном случае мы работаем с глобальным объектом window мы не можем обратиться к его свойству clear так как в цепочке областей видимости объкт document стоит раньше.Кстати, если насильно вызвать функцию, как свойство объекта window то сработает:
 <button class="clearBox" onclick="return window.clear();">Очистить</button>