点击删除按钮弹出对话框提示是否删除

原理:confirm() 方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。如果用户点击确定按钮,则 confirm() 返回 true。如果点击取消按钮,则 confirm() 返回 false。在用户点击确定按钮或取消按钮把对话框关闭之前,它将阻止用户对浏览器的所有输入。在调用 confirm() 时,将暂停对 JavaScript 代码的执行,在用户作出响应之前,不会执行下一条语句。
方法一:使用Js 的confirm方法

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">

    <title>My JSP 'index.jsp' starting page</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script type="text/javascript" src="./Jscript/jquery.min.js"></script>
  </head>

  <body>
    <input id="input" type="button" value="删除" />
    <script type="text/javascript">
        $().ready(function(){
            $("#input").click(function(){   //点击按钮访问后台servlet
                var r=confirm("确定删除吗?")
                if (r==true)
                {
                    var xhr  = createXmlHttpRequest();
                    xhr.onreadystatechange = function(){
                        if(xhr.readyState == 4){
                            if(xhr.status == 200 || xhr.status == 304){
                                alert("aaaa");
                            }
                        }
                    }   
                    xhr.open("GET","servlet/JOptionServlet?time=" + new Date().getTime());
                    xhr.send(null);

                }else{

                }       

            });     
        });
        function createXmlHttpRequest(){
           var xmlHttp;
           try{    //Firefox, Opera 8.0+, Safari
                   xmlHttp=new XMLHttpRequest();
            }catch (e){
                   try{    //Internet Explorer
                          xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
                    }catch (e){
                          try{
                                  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                          }catch (e){}  
                   }
            }
           return xmlHttp;
        }
    </script>
  </body>
</html>

注:熟练之后可以使用layer

<!DOCTYPE html>
<html>
  <head>
    <title>MyHtml.html</title>

    <meta name="keywords" content="keyword1,keyword2,keyword3">
    <meta name="description" content="this is my page">
    <meta name="content-type" content="text/html; charset=gbk">

    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
    <script type="text/javascript" src="./Jscript/jquery.min.js"></script>
    <script type="text/javascript" src="./layer/layer.js"></script>
  </head>

  <body>
    <button id="test1">小小提示层</button>

    <script type="text/javascript">
        $('#test1').on('click', function(){
            layer.confirm('确定删除吗?', {
                btn: ['确定','取消'] //按钮
                }, function(){   //点击确定访问后台
                    var xhr  = createXmlHttpRequest();
                     xhr.onreadystatechange = function(){
                        if(xhr.readyState == 4){
                            if(xhr.status == 200 || xhr.status == 304){
                                layer.msg('已删除', {icon: 1});
                            }
                        }
                    }  
                    xhr.open("GET","servlet/JOptionServlet?time=" + new Date().getTime());
                    xhr.send(null);                 
                }, function(){   //点击取消则中断操作
                    layer.msg('已取消', {
                    time: 2000, //2s后自动关闭                   
                });
            });
        });
        function createXmlHttpRequest(){
           var xmlHttp;
           try{    //Firefox, Opera 8.0+, Safari
                   xmlHttp=new XMLHttpRequest();
            }catch (e){
                   try{    //Internet Explorer
                          xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
                    }catch (e){
                          try{
                                  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                          }catch (e){}  
                   }
            }
           return xmlHttp;
        }
    </script>
  </body>
</html>

方法二:Swing

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章