Функция не отправляет оповещение в браузере HTML, JavaScript - PullRequest
Новая
       12

Функция не отправляет оповещение в браузере HTML, JavaScript

0 голосов
/ 18 февраля 2020

От ie до HTML и Javascript здесь.

Я пишу очень простую c программу, которая позволяет пользователю вводить номер карты, а браузер должен сказать, если он является действительным числом (между 13-16 цифрами) или нет.

Веб-сайт загружается и показывает все, что я хочу, но когда номер введен (действительный или недействительный), предупреждение не отправляется, чтобы сказать если номер был хорошим или нет.

Любые предложения о том, как я могу это исправить? 

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Card Reader</title>
  <link type=’text/css’/>
  <script>
    'use strict';
    function getNumber(cardNum) {
        if (cardNum.length > 16 || cardNum.length < 13) {
            alert(‘This is not valid.’);
            return false;}
        else {
            alert(‘This is valid.’);
            return true;}
    }
  </script>
</head>

<body onload=“document.cardNum()”>

<h4> Enter Credit Card Number: </h4>
<form>
    <input type='text' id=‘cardNum’ name=‘cardNum’/>
    <br>
    <input type="submit" value=Submit onclick = “getNumber(cardNum)”/>
</form>

</body>
</html>

Ответы [ 4 ]

3 голосов
/ 18 февраля 2020

Было 3 вещи, которые я исправил; 1- onload = «document.cardNum ()», такой функции нет, поэтому ваша страница сразу падает, поэтому дальнейший сценарий не выполняется. 2 - Я не знаю, испортился ли он во время вставки, но некоторые из ваших цитат недействительны, вам следует use "and '3- Это только предотвращает правильную работу; в вашей функции вы передаете ссылку на вход и проверяете HTML длину элемента, вам нужно проверить значение ввода 

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Card Reader</title>
  <link type=’text/css’/>
  <script>
    function getNumber(cardNum) {
        if (cardNum.value.length > 16 || cardNum.value.length < 13) {
            alert("This is not valid.");
            return false;}
        else {
            alert("This is valid.");
            return true;}
    }
  </script>
</head>

<body>

<h4> Enter Credit Card Number: </h4>
<form>
    <input type='text' id="cardNum" name="cardNum"/>
    <br>
    <input type="submit" value=Submit onclick = "getNumber(cardNum)"/>
</form>

</body>
</html>
0 голосов
/ 18 февраля 2020 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Card Reader</title>
    <link type=’text/css’/>

    <script>
      function myFunction() {
        var x = document.getElementById("cardNum").value;
        if (isNaN(x) || x.length < 13 || x.length > 16) {
          alert("Input not valid");
        } else {
          alert("Input OK");
        }
      }
    </script>
  </head>
  <body>
    <h4>Enter Credit Card Number:</h4>

    <input type="text" id="cardNum" name="cardNum" />

    <button type="button" onclick="myFunction()">Submit</button>
  </body>
</html>

Это простой и прямой подход.

0 голосов
/ 18 февраля 2020

Как и Шубхам оли, вы также можете использовать HTML5 проверки, как показано ниже. 

<form >
    <input type='text'  id="cardNum"  name="cardNum" required pattern='[0-9]{13,16}'/ >
    <br>
    <input type="submit" value='Submit' >
</form>
0 голосов
/ 18 февраля 2020

Было 3 вещи, которые я исправил; 1- onload = «document.cardNum ()», такой функции нет, поэтому ваша страница сразу падает, поэтому дальнейший сценарий не выполняется. 2 - Я не знаю, испортился ли он во время вставки, но некоторые из ваших цитат недействительны, вам следует use "and '3- Это только предотвращает правильную работу; в вашей функции вы передаете ссылку на вход и проверяете HTML длину элемента, вам нужно проверить значение ввода 

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Card Reader</title>
  <link type='text/css'/>
  <script>
    'use strict';
    function getNumber(cardNum) {
        if (cardNum.length <= 16 && cardNum.length >= 13) {
            alert('This is valid.');
            return false;
          }
        else {
            alert('This is not valid.');
            return true;
          }
    }
  </script>
</head>

<body>

<h4> Enter Credit Card Number: </h4>
<form>
    <input type='text' id='cardNum' name='cardNum'/>
    <br>
    <input type="submit" value='Submit' onclick="getNumber(document.getElementById('cardNum').value)"/>
</form>

</body>
</html>
...