如何在JSP中按钮点击时显示弹出窗口

页面的代码如下：

<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="enroll.jsp" 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>

当我点击Enroill按钮，我想显示弹出像与图像源标签下面。

我该怎么做JSP的？任何建议都很有帮助。

来源

2016-04-21 osimer pothe

纯粹它不可能显示弹出和显示图像弹出。您可以使用jQuery UI对话框。如果你使用引导程序框架，它会有很好的模式，你可以插入任何你想要的东西。

来源

2016-04-21 07:28:40

帮我做到这一点使用引导程序代码段 –

下面是使用引导

<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    
 
    <title>Online Demonstration</title> 
 

 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
</head> 
 
    <body> 
 
    
 
\t <div class="container"> 
 
\t \t <div class="panel panel-default"> 
 
\t \t \t <div class="panel-heading">Online Demonstration</div> 
 
\t \t \t \t <form name="scan" method="POST" action="enroll.asp"> 
 
\t \t \t \t <div class="panel-body"> 
 
\t \t \t \t \t <p>Thanks for your registration. You can enroll two fingers for the name you registered.</p> 
 
\t \t \t \t \t <div class="row"> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t \t <div class="form-group"> 
 
          <label class="col-md-5">Please input your name:</label> 
 
          <div class="col-md-5"> 
 
           <input type="text" class="form-control" id="UserName"/> 
 
          </div> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t 
 
\t \t \t \t \t </div> 
 
\t \t \t \t 
 
\t \t \t \t \t <div class="row"> 
 
\t \t \t \t \t \t <div class="form-group"> 
 
          <label class="col-md-5">If you want to enroll 2 fingers, please check the box.</label> 
 
          <div class="col-md-5"> 
 
           <input type="checkbox" name="chk2Finger" value="2"> 
 
\t \t \t \t \t \t \t 
 
\t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t 
 
         </div> 
 
\t \t \t \t \t \t 
 
\t \t \t \t \t </div> 
 
\t \t \t \t \t \t <input class="btn btn-default" type="submit" value="Submit"> 
 
       </div> 
 
\t \t \t </form> \t 
 
\t \t </div> 
 
\t </div> 
 
\t 
 
<!-- Modal code goes here--> 
 
<div class="modal fade" tabindex="-1" role="dialog" id="myModal"> 
 
    <div class="modal-dialog"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"> 
 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
 
     <h4 class="modal-title">Modal title</h4> 
 
     </div> 
 
     <div class="modal-body"> 
 
\t <div class="container"> 
 
\t \t <div class=row> 
 
\t \t <img src="" class="img-thumbnail col-lg-2"> 
 
\t </div> 
 
\t </div> 
 
\t 
 
     
 
     </div> 
 
     <div class="modal-footer"> 
 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
     <button type="button" class="btn btn-primary">Save changes</button> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> 
 
<!-- /.modal --> \t 
 
    
 

 
\t <script type="text/javascript"> 
 
\t function inStrGrp(src,reg){ 
 
\t \t var regex=new RegExp("[" + reg + "]","i"); 
 
\t \t return regex.test(src); 
 
\t } 
 

 
$(document).ready(function(){ 
 
\t \t $('input[type="submit"]').click(function (e) { 
 
\t \t \t \t e.preventDefault(); 
 
\t \t \t \t var userName = document.getElementById('UserName').value; 
 
\t \t \t \t var bError=false 
 

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

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

 
\t \t \t if (bError) 
 
\t \t \t { 
 
\t \t \t \t window.alert('User name can not contain the following characters:\n \\/. :*?"<>|\n') 
 
\t \t \t \t return false 
 
\t \t \t } 
 
\t \t \t else 
 
\t \t \t \t $('#myModal').modal('show'); 
 
\t \t \t \t return true 
 
\t \t 
 

 
\t \t }); 
 
\t }); 
 
\t 
 
\t </script> 
 
\t 
 
\t 
 
    </body> 
 
</html>

希望它会help.Thanks

来源

2016-04-21 08:56:22

如何在JSP中按钮点击时显示弹出窗口

回答

相关问题