Java脚本在html表单上的验证不起作用？

Question

I coded an HTML form where I tried to validate it using javascript, However, the validation doesn't work. 我编写了一个HTML表单，尝试使用javascript对其进行验证，但是，该验证无效。 It should work on click of submit button. 单击提交按钮即可使用。 Everything looks fine! 一切看起来都很好！ could not find the error! 找不到错误！ Please Help. 请帮忙。 Below is the code for the page: 以下是该页面的代码：

 <!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>Term Deposit Interest Calculator</title>
<link rel="stylesheet" href="css/style.css" media="screen" type="text/css" />
 <script>  
function validateform(){  
var amount=document.myform.amount.value;  
var years=document.myform.years.value; 
var interst= document.myform.interst.value; 

if (amount==null || amount==""){  
  alert("Amount can't be blank");  
  return false;  
}else if (years==null || years==""){  
  alert("Years can't be blank");  
  return false;  
}else if (interest==null || interest==""){  
  alert("Interest can't be blank");  
  return false;  
}

}  
</script>  

</head>

<body>

  <div class="card">
    <h3>Term Deposit Interest Calculator</h3><br>
  <form name = "myform"  method="post"onsubmit="return validateform()">
    <input type="text" name="amount" placeholder="Deposit Amount"><span id="num1"></span>
    <input type="text" name="years" placeholder="Number Of Years"><span id="num2"></span>
    <input type="text" name="interest" placeholder="Yearly Interst Rate"><span id="num3"></span>

    <input type="submit" name="submit" class="my submit" value="Total Amount">
  </form>

  <div class="result">

  </div>
</div>
</body>

</html>
<?php
if (!isset($amount7032)) { $amount7032 = ''; }
if (!isset($interest7032)) { $interest7032 = ''; }
if (!isset($years7032)) { $years7032 = ''; }
?>

Answer 1

You have written wrong form element name at below line 您在下面的行中输入了错误的表单元素名称

var interst= document.myform.interst.value;

it should be 它应该是

var interest= document.myform.interest.value;

Basically because javascript was not able to find the form element and it was failing due to that. 基本上是因为javascript无法找到form元素，并因此而失败。

I tried below code and its working: 我尝试了下面的代码及其工作方式：

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Term Deposit Interest Calculator</title>
    <link rel="stylesheet" href="css/style.css" media="screen" type="text/css" />
    <script>
        function validateform(){  
        var amount=document.myform.amount.value;  
        var years=document.myform.years.value; 
        var interest= document.myform.interest.value; 

        if (amount==null || amount==""){  
          alert("Amount can't be blank");  
          return false;  
        }else if (years==null || years==""){  
          alert("Years can't be blank");  
          return false;  
        }else if (interest==null || interest==""){  
          alert("Interest can't be blank");  
          return false;  
        }

        }
    </script>

</head>

<body>

    <div class="card">
        <h3>Term Deposit Interest Calculator</h3><br>
        <form name="myform" method="post" onsubmit="return validateform()">
            <input type="text" name="amount" placeholder="Deposit Amount"><span id="num1"></span>
            <input type="text" name="years" placeholder="Number Of Years"><span id="num2"></span>
            <input type="text" name="interest" placeholder="Yearly Interst Rate"><span id="num3"></span>

            <input type="submit" name="submit" class="my submit" value="Total Amount">
        </form>

        <div class="result">

        </div>
    </div>
</body>

</html>

Java脚本在html表单上的验证不起作用？

问题描述

1 个解决方案

解决方案1
0 2018-06-15 04:11:05

Java脚本在html表单上的验证不起作用？

问题描述

1 个解决方案

解决方案1 0 2018-06-15 04:11:05

解决方案1
0 2018-06-15 04:11:05