Блог

Главная - Вопросы по программированию - Есть ли способ заставить функцию проверять значения?

Есть ли способ заставить функцию проверять значения?

#javascript #html #css

Вопрос:

Это снова я!

Я пытаюсь найти значение ввода и проверить, является ли значение определенной строкой после нажатия кнопки. Это сбивает с толку, но вот мой код:

 var codeenter = document.getElementById("code")
console.log("Script")
function check() {
    var codecheck = codeenter.value;
    console.log("Started, you have clicked it.")
    if (codecheck === "109843") {
        document.getElementById("wel").innerHTML = "Hey, Sam King"
    }
} 
 #title {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: xx-large;
    text-align: center;
}

html {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    text-align: center;
}

#button {
    width: 20em;
    height: 2em;
    background-color: aliceblue;
    border: none;
}

#name {
    text-align: center;
    object-position: center;
    margin: auto 0px;
}

#code {
    text-align: center;
}

#emsub {
    background-color: aquamarine;
    border: none;
    width: 10em;
    height: 2em;
} 
 <!DOCTYPE html>
<title>Emergency Login</title>
<link rel="stylesheet" href="./style.css">
<body>
    <form action="./emergencysucess.html">
        <input type="text" id="code" placeholder="Emergency Code">
        <input type="text" id="name" placeholder="Your Name">
        <br>
        <button type="submit" id="emsub" onclick="check">Login</button>
    </form>
</body>
<script src="./script.js"></script>

Все это работает, хотя я не думаю onclick="check" , что это работает, так как он даже не запускает функцию, потому что, как вы можете видеть в коде, он должен что-то регистрировать, но он даже не регистрирует это, так что я немного смущен.

Кроме этого, нет никаких других сообщений об ошибках и «emergencysucess.html» это досье.

Не могли бы вы помочь?

Не путайте, он записывает сценарий в начале файла .js.

Спасибо!

Комментарии:

1. где вы ожидаете увидеть журналы? Этот код обновит страницу, поэтому журналы на стороне клиента исчезнут

2. Я ожидаю увидеть его в консоли, там же, где и журнал сценариев. Я вроде как новичок, так что не используй все эти крутые выражения, лол.

3. сформируйте onsubimit, а затем превентируйте. Кнопка отправляет форму — так она перенаправляет страницу.

4. Что ты имеешь в виду? Пожалуйста, опубликуйте это в ответе.

5. @Samyk: «это не меняет html на другой странице» — Ну нет, это не так. Потому что код выполняется на этой странице. Рассматривайте каждую страницу как свое собственное приложение. Когда один выгружается, а другой загружается, любой код с этой предыдущей страницы больше не выполняется. Похоже, вы хотите запустить какой-то код на какой-то другой странице, а не на этой.

Ответ №1:

У вас есть 2 причины, по которым это не работает:

  1. В onclick том случае, если вы не пишете функцию, вам нужно вызвать эту функцию.
  2. При использовании type="submit" html попытаюсь отправить форму на ваш action . Если вы не хотите, чтобы это произошло, вам нужно return false от onclick .
 var codeenter = document.getElementById("code")
console.log("Script")

function check() {
  var codecheck = codeenter.value;
  console.log("Started, you have clicked it.")
  if (codecheck === "109843") {
    document.getElementById("wel").innerHTML = "Hey, Sam King"
  }
} 
 #title {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: xx-large;
  text-align: center;
}

html {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  text-align: center;
}

#button {
  width: 20em;
  height: 2em;
  background-color: aliceblue;
  border: none;
}

#name {
  text-align: center;
  object-position: center;
  margin: auto 0px;
}

#code {
  text-align: center;
}

#emsub {
  background-color: aquamarine;
  border: none;
  width: 10em;
  height: 2em;
} 
 <form action="./emergencysucess.html">
  <input type="text" id="code" placeholder="Emergency Code">
  <input type="text" id="name" placeholder="Your Name">
  <br>
  <button type="submit" id="emsub" onclick="check(); return false">Login</button>
</form>
<div id="wel"></div>

Ответ №2:

Вам нужно использовать event.preventDefault() , чтобы остановить действие кнопки «Отправить» по умолчанию.

https://developer.mozilla.org/en-US/docs/Web/API/Event/preventDefault

 var codeenter = document.getElementById("code")
console.log("Script")
function check(event) {
  event.preventDefault();
    var codecheck = codeenter.value;
    console.log("Started, you have clicked it.")
    if (codecheck === "109843") {
        document.getElementById("wel").innerHTML = "Hey, Sam King"
    }
} 
 #title {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: xx-large;
    text-align: center;
}

html {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    text-align: center;
}

#button {
    width: 20em;
    height: 2em;
    background-color: aliceblue;
    border: none;
}

#name {
    text-align: center;
    object-position: center;
    margin: auto 0px;
}

#code {
    text-align: center;
}

#emsub {
    background-color: aquamarine;
    border: none;
    width: 10em;
    height: 2em;
} 
 <!DOCTYPE html>
<title>Emergency Login</title>
<link rel="stylesheet" href="./style.css">
<body>
    <form action="./emergencysucess.html">
        <input type="text" id="code" placeholder="Emergency Code">
        <input type="text" id="name" placeholder="Your Name">
        <br>
        <button type="submit" id="emsub" onclick="check(event)">Login</button>
    </form>
    <p id="wel" />
</body>
<script src="./script.js"></script>
Метки: