Почему созданная функция не работает.? - PullRequest
0 голосов
/ 12 февраля 2020

Я работал над проектом библиотеки и в нем, когда человек нажимает кнопку добавления Javascript и должен вывести на консоль «привет, ты отправил форму», и он не работает. Пожалуйста, помогите с этим.

html

<form id="libraryform">
  <div class="form-group row">
    <label for="bookname" class="col-sm-2 col-form-label">name</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="bookname" placeholder="book name pls">
    </div>
  </div>
  <div class="form-group row">
    <label for="author" class="col-sm-2 col-form-label">author</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id="author" placeholder="author pls ">
    </div>
  </div>
  <fieldset class="form-group">
    <div class="row">
      <legend class="col-form-label col-sm-2 pt-0">genre of book</legend>
      <div class="col-sm-10">
        <div class="form-check">
          <input class="form-check-input" type="radio" name="type" id="fiction" value="fiction" checked>
          <label class="form-check-label" for="fiction">fiction</label>
        </div>
        <div class="form-check">
          <input class="form-check-input" type="radio" name="type" id="programming" value="programming">
          <label class="form-check-label " for="programming">computer programming</label>
        </div>
        <div class="form-check ">
          <input class="form-check-input" type="radio" name="type" id="cooking" value="cooking">
          <label class="form-check-label" for="cooking">cooking</label>
        </div>
      </div>
    </div>
  </fieldset>
  <div class="form-group row">
    <div class="col-sm-10">
      <button type="submit" id="librarysubmit" class="btn btn-primary">add book</button>
    </div>
  </div>
</form>

и Javascript код здесь:

let librarysubmit = document.getElementById("librarysubmit");
librarysubmit.addEventListener('submit', libraryformsubmit);
function libraryformsubmit() {
    console.log("hey great u have submitted the form ");
    e.preventdefault() 
    e.preventdefault() 
}

Ответы [ 2 ]

2 голосов
/ 12 февраля 2020

Вы используете отправку события на кнопке. Вам необходимо прикрепить событие к форме.

Как

document.getElementById("libraryform")

И ваша функция js недействительна, вы забыли событие params

function libraryformsubmit(e) {
  console.log("hey great u have submitted the form ");
  e.preventDefault() 
}
0 голосов
/ 12 февраля 2020

Есть две незначительные вещи, которые нужно изменить

1. От

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

до

let librarysubmit = document.getElementById('libraryform');

Потому что - событие отправки отправляется в форме.

изменить e.preventdefault() на e.preventDefault(); Captialize D по умолчанию.

Демонстрационная ссылка: https://codepen.io/punith/pen/GRJpOrz?editors=1011

...