Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/438.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript表单摘要页面_Javascript_Html_Forms - Fatal编程技术网

Javascript表单摘要页面

Javascript表单摘要页面,javascript,html,forms,Javascript,Html,Forms,我已经创建了一个包含多个函数的Javascript表单,我希望在单击submit按钮后生成一个包含表单中输入的所有值的摘要页面。我的问题是如何生成此摘要页面?请看下面我的代码 谢谢 <script type='text/javascript'> function formValidator(){ // Make quick references to our fields var firstname = document.getElementById('firstname')

我已经创建了一个包含多个函数的Javascript表单,我希望在单击submit按钮后生成一个包含表单中输入的所有值的摘要页面。我的问题是如何生成此摘要页面?请看下面我的代码

谢谢

<script type='text/javascript'>
function formValidator(){
  // Make quick references to our fields
  var firstname = document.getElementById('firstname');
  var lastname = document.getElementById('lastname');
  var addr = document.getElementById('addr');
  var pcode = document.getElementById('pcode');
  var course = document.getElementById('course');
  var username = document.getElementById('username');
  var email = document.getElementById('email');
  // Check each input in the order that it appears in the form!
  if(isAlphabet(firstname, "Please enter only letters for your name")){
    if(isAlphanumeric(addr, "Numbers and Letters Only for Address")){
      if(isNumeric(pcode, "Please enter a valid post code")){
        if(madeSelection(course, "Please Choose a Course")){
          if(lengthRestriction(username, 6, 8)){
            if(emailValidator(email, "Please enter a valid email address")){
              return true;
            }
          }
        }
      }
    }
  }
  return false;
}

function notEmpty(elem, helperMsg){
  if(elem.value.length == 0){
    alert(helperMsg);
    elem.focus(); // set the focus to this input
    return false;
  }
  return true;
}

function isNumeric(elem, helperMsg){
  var numericExpression = /^[0-9]+$/;
  if(elem.value.match(numericExpression)){
    return true;
  }else{
    alert(helperMsg);
    elem.focus();
    return false;
  }
}

function isAlphabet(elem, helperMsg){
  var alphaExp = /^[a-zA-Z]+$/;
  if(elem.value.match(alphaExp)){
    return true;
  }else{
    alert(helperMsg);
    elem.focus();
    return false;
  }
}

function isAlphanumeric(elem, helperMsg){
  var alphaExp = /^[0-9a-zA-Z]+$/;
  if(elem.value.match(alphaExp)){
    return true;
  }else{
    alert(helperMsg);
    elem.focus();
    return false;
  }
}

function lengthRestriction(elem, min, max){
  var uInput = elem.value;
  if(uInput.length >= min && uInput.length <= max){
    return true;
  }else{
    alert("Please enter between " +min+ " and " +max+ " characters");
    elem.focus();
    return false;
  }
}

function madeSelection(elem, helperMsg){
  if(elem.value == "Please Choose a Course"){
    alert(helperMsg);
    elem.focus();
    return false;
  }else{
    return true;
  }
}

function emailValidator(elem, helperMsg){
  var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
  if(elem.value.match(emailExp)){
    return true;
  }else{
    alert(helperMsg);
    elem.focus();
    return false;
  }
}

</script>

<form name="javaform" action="javasummary.html" method="post" onsubmit="return formValidator();">
  <label>First Name:</label> <input type='text' id='firstname' size='50'/><br />
  <label>Last Name:</label> <input type='text' id='lastname' size='50'/><br />
  <label>Address:</label> <input type='text' id='addr' size='50' /><br />
  <label>Post Code:</label> <input type='text' id='pcode' size='50'/><br />
  <label>Course:</label> <select id='course'>
  <option>Please Choose a Course</option>
  <option>PHP | £500 | 18/02/2012</option>
  <option>CSS | £400 | 03/03/2011</option>  
  <option>HTML | £550 | 04/02/2012</option>
  <option>FLASH(NEW) | £1220 | 25/12/2012</option>
</select><br />
  <label>Username(6-8 characters):</label>
  <input type='text' id='username' size='50'/><br />
  <label>Email:</label>
  <input type='text' id='email' size='50'/><br />
  <input type='submit' value='Submit'>
</form>

你有一个结束,但没有开始…顺便说一句,你可以在你的表单的提交中生成这样一个摘要。这就是你想要的答案吗?或者你想让我们为你写代码吗?如果你能写一个这样的代码就好了