如何在JavaScript中调用后台中的另一个页面

时间：2016-04-26 06:01:50

标签： javascript jquery html

我在enroll.html中有一个按钮。页面代码如下：

<HTML>
<HEAD>
<META http-equiv=Content-Language content=en-us>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<style TYPE="text/css">
    <!-- BODY               { font-family:arial,helvetica; margin-left:5; margin-top:0}
            A                   { color:#FF5500; text-decoration:underline}
            A:hover,A:active    { color:#0055FF; text-decoration:underline}
        -->
</style>
<Script Language="JavaScript">
<!--
function inStrGrp(src,reg)
{
    var regex=new RegExp("[" + reg + "]","i");
    return regex.test(src);
}

function check()
{   
    var uname=document.scan.elements[0].value
    var bError=false

    if (uname.length==0)
    {
        window.alert("Name is required.\n")
        return false
    }
    if (uname.indexOf("\\")>=0)
        bError=true

    if (inStrGrp(uname,'/.:*?"<>| '))
        bError=true

    if (bError)
    {
        window.alert('User name can not contain the following characters:\n \\/. :*?"<>|\n')
        return false
    }
    else 
        return true  
}
-->
</Script>

<title>Enroll New Fingerprint.</title>
</HEAD>
<BODY onload="document.scan.name.focus();">
<center>
<table border="0" width="800">
  <tr>
    <td width="100%" colspan="3">
      <p>&nbsp;</p>
      <p><u><b>Online Demonstration</b></u></p>
      <div align="center">
      <table border="1" width="100%" height="260">
        <tr>
          <td width="20%" align="center" rowspan="2">
                <p>&nbsp;</p>
                <p><font color="#0055FF">Enroll</font></p>
              <p><a href="logon.asp">Logon</a></p>
              <p>&nbsp;</p>
          </td>
          <td width="80%" height="30">
              <b><i>Enroll Finger</i></b>
          </td>
         </tr>
         <tr>
          <td width="80%">
      <p>Thanks for your registration. You can enroll two fingers for the name you registered.</p>

      <form name="scan" method="POST" action="http://10.11.201.170/data/sultan/enroll.asp" onsubmit="return check()">
        <p>Please input your name: <input type="text" name="name" size="20">&nbsp;&nbsp;&nbsp;&nbsp;</p>
        <p>If you want to enroll 2 fingers, please check the box. <input type="checkbox" name="chk2Finger" value="2">&nbsp;&nbsp;</p>
        <p>&nbsp;
        <input type="submit" value="   Enroll   " name="btnEnroll"></p>
      </form>

            </td>
        </tr>
      </table>
      </div>
      <p>&nbsp;</p>
    </td>
  </tr>
  <tr>
    <td width="100%" colspan="3">
      <p align="center"><small>Copyright © 2004 Futronic
      Technology Company Limited. All Rights Reserved.</small></td>
  </tr>
</table>
</center>
</BODY>
</HTML>

当我按下注册按钮时，我想在后台加载名为verify.asp的页面。我怎样才能做到这一点 ？

verify.asp的代码如下：

<HTML>
<HEAD>
<META http-equiv=Content-Language content=en-us>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<style TYPE="text/css">
    <!-- BODY               { font-family:arial,helvetica; margin-left:5; margin-top:0}
            A                   { color:#FF5500; text-decoration:underline}
            A:hover,A:active    { color:#0055FF; text-decoration:underline}
        -->
</style>
<Script Language="VBScript" Src="GetInfo.vbs">
</Script>
<title>Enroll Fingerprint.</title>
</HEAD>
<BODY Onload="GetLearnModel()";>
<center>
<table border="0" width="800">
  <tr>
    <td width="100%" colspan="3">
      <p>&nbsp;</p>
      <p><u><b>Online Demonstration</b></u></p>
      <div align="center">
      <table border="1" width="100%" height="260">
        <tr>
          <td width="20%" align="center" rowspan="2">
                <p>&nbsp;</p>
                <p><a href="enroll.asp">Enroll</a></p>
              <p><a href="logon.asp">Logon</a></p>
              <p>&nbsp;</p>
          </td>
          <td width="80%" height="30">
              <b><i>Enroll Finger</i></b>
          </td>
         </tr>
         <tr>
          <td width="80%">
        <Form name="scan" method="Post" action="famenroll2.asp?name=<%=Request("name")%>&check=<%=Request("check")%>&finger=<%=Request("finger")%>">
        <Input type="hidden" name="LearnModel" value="">
        <Input type="text" name="SlNo" value="">
        </Form>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
            <p><font size="5" color="#ff0000"><%=Request.Form("SlNo")%></font><font size="5">&nbsp;&nbsp;Enroll Successfully!</font></p>
            </td>
        </tr>
      </table>
      </div>
      <p>&nbsp;</p>
    </td>
  </tr>
  <tr>
    <td width="100%" colspan="3">
      <p align="center"><small>Copyright © 2004 Futronic
      Technology Company Limited. All Rights Reserved.</small></td>
  </tr>
</table>
 <% Dim Conn,strSQL,objExec,NumOfRecords,se_name,finger
            cust_no=Request.QueryString("name")
            Set Conn = Server.Createobject("ADODB.Connection")  
            Conn.Open "Driver={Oracle in XE};DBQ=xe;UID=biotpl;PWD=biotpl;"           

            'Query for the customer entry in FP_ENROLL Table
            strSQL2 = "INSERT INTO TEST  values(1,'OS')" 

                Set objExec = Conn.Execute(strSQL2)

            'Query for the no of fingers to be taken for a customer in FP_FINGER_SETUP Table                  
            'Set objExec = Conn.Execute("select FINGURE_NO NoF from BIOTPL.FP_FINGER_SETUP where USER_TYPE=" & Request.QueryString("cust_type") )  
            'NumOfFingers = objExec("NoF")

            'Conn.Close()  
             Set objExec = Nothing  
             Set Conn = Nothing  
 %>
</center>
</BODY>
</HTML>

4 个答案:

答案 0 :(得分：1)

Ajax可用于在后台加载页面。 jQuery supports AJAX功能，它比第一个链接中描述的更容易。如果您的目的是验证注册，则需要解析来自AJAX请求的回复。可以在here找到解析的早期答案。

基本步骤是

  1. 在表单提交按钮中添加ID（例如＆＃39;注册＆＃39;）

  2. 通过在标题中添加以下内容，将jQuery JavaScript库包含到您的项目中 < script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>‌

    3. 3.Within script tag，使用类似的方法如下。

    $("#enroll").click(function(){ 
     $.ajax({
        url: "verify.asp", 
        success:   function(result){ 
                      /* Parse the result and do whatever you want to do here */
        }
      });
});

答案 1 :(得分：1)

在此行中添加ID 

<input type="submit" value="   Enroll   " name="btnEnroll">

所以它变成了：

<input type="submit" value="   Enroll   " id="buttonEnroll" name="btnEnroll">
<div id="result"></div>

而不是写这个脚本

    <script>
       $("#buttonEnroll").on('click',function(e){
           e.preventDefault();
           $( "#result" ).load( "verify.asp" );
           alert("Page loading completed");  
       });
    </script>

#result is for loading that page in result id div.

希望帮助！

在标题标记

中添加此内容 
<script   src="https://code.jquery.com/jquery-2.2.3.min.js"   integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo="   crossorigin="anonymous"></script>

答案 2 :(得分：0)

//1st way::

function doFunction(event) {
   event.preventDefault();
  //here you can load verify.aspx by using 
   $("#resultdiv").load("verify.aspx", {}, function (data) {
    alert("loading complete");  
   });
}


//2nd way:
//By using ajax call

$('#enroll').on('click', 'input[type="submit"]', function(e){
  e.preventDefault();
   $.post('http://mywebsite/verify.aspx',{ 'data': $('#txt_search').val() } ,function(data) {
     console.log(data); // this would show you the returned data.
   });
});
You can do it in 2ways:

HTML:

1st way::
=========
Add onclick to your enroll button.
<input type="submit" value="Enroll" onclick="doFunction();" id="enroll" name="btnEnroll"></p>
<div id="resultdiv">
  </div>

2nd way:
========
By using ajax call

答案 3 :(得分：0)

以下是修改过的带有修改过的Js

的enroll.html 

<HTML>
<HEAD>
<META http-equiv=Content-Language content=en-us>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<style TYPE="text/css">
    <!-- BODY               { font-family:arial,helvetica; margin-left:5; margin-top:0}
            A                   { color:#FF5500; text-decoration:underline}
            A:hover,A:active    { color:#0055FF; text-decoration:underline}
        -->
</style>
<script   src="https://code.jquery.com/jquery-1.12.3.min.js"></script>

<title>Enroll New Fingerprint.</title>
</HEAD>
<BODY>
<center>
<table border="0" width="800">
  <tr>
    <td width="100%" colspan="3">
      <p>&nbsp;</p>
      <p><u><b>Online Demonstration</b></u></p>
      <div align="center">
      <table border="1" width="100%" height="260">
        <tr>
          <td width="20%" align="center" rowspan="2">
                <p>&nbsp;</p>
                <p><font color="#0055FF">Enroll</font></p>
              <p><a href="logon.asp">Logon</a></p>
              <p>&nbsp;</p>
          </td>
          <td width="80%" height="30">
              <b><i>Enroll Finger</i></b>
          </td>
         </tr>
         <tr>
          <td width="80%">
      <p>Thanks for your registration. You can enroll two fingers for the name you registered.</p>

      <form name="scan" >
        <p>Please input your name: <input type="text" name="txtName" size="20" id="txtname">&nbsp;&nbsp;&nbsp;&nbsp;</p>
        <p>If you want to enroll 2 fingers, please check the box. <input type="checkbox" name="chk2Finger" value="2">&nbsp;&nbsp;</p>
        <p>&nbsp;
        <input type="button" value="Enroll" name="btnEnroll" id="btnEnroll"></p>
      </form>

            </td>
        </tr>
      </table>
      </div>
      <p>&nbsp;</p>
    </td>
  </tr>
  <tr>
    <td width="100%" colspan="3">
      <p align="center"><small>Copyright © 2004 Futronic
      Technology Company Limited. All Rights Reserved.</small></td>
  </tr>
</table>
</center>
</BODY>
</HTML>

<script type="text/javascript">

		function inStrGrp(src,reg)
		{
			var regex=new RegExp("[" + reg + "]","i");
			return regex.test(src);
		}

$(document).ready(function(){

	$('#btnEnroll').on('click',function(){
		var uname = $('#txtname').val();
		
	 var bError=false

    if (uname.length==0)
    {
        window.alert("Name is required.\n")
        return false
    }
    if (uname.indexOf("\\")>=0)
        bError=true

    if (inStrGrp(uname,'/.:*?"<>| '))
        bError=true

    if (bError)
    {
        window.alert('User name can not contain the following characters:\n \\/. :*?"<>|\n')
        return false
    }
    else 
		var url = "enroll.asp?name="+uname;
		window.location = url;
        return true  

	
	
	});



});


</script>

更改javascript代码中的网址并添加你的。如果你的网址看起来像

  

http://help.sap.com/saphelp_hanaplatform/helpdata/en/f3/5ec71c485e493aa20d0bd0e3bff06a/frameset.htm

然后

更改脚本部分中的变量url，如下所示

var url = "http://10.11.201.170/data/sultan/enroll.asp?name="+uname;

并且您的enroll.asp将保持不变。

希望这会有所帮助。

相关问题
最新问题