ajax的简单应用
jsp文件:
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %><%--
Created by IntelliJ IDEA.
User: Administrator
Date: 2020/8/3
Time: 12:09
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="true" %>
<html>
<head>
<title>今进</title>
</head>
<body>
javascript时钟:<h1 id="jst"></h1>
ajax <h2 id="we"></h2>
<script>
//ajax js代码配合下面的jsp中的java代码实现时钟的走动
let a=new XMLHttpRequest(); //声明 ajax变量
a.onreadystatechange=function(){
if (a.status==200 && a.readyState==4){
document.getElementById("we").innerHTML=a.responseText;
}
}
function sst(){
a.open("post","test1.jsp",true);
a.setRequestHeader("Content-type","application/x-www-form-rulencoded")
a.send(null);
}
sst();
setInterval(sst,1000);
//只用js写日期;
function st() {
let d=new Date();
let nian=d.getFullYear();
let yue =(d.getMonth()+1).toString().padStart(2,0);
let ri =d.getDate().toString().padStart(2,0);
let shi =d.getHours().toString().padStart(2,0);
let fen =d.getMinutes().toString().padStart(2,0);
let miao =d.getSeconds().toString().padStart(2,0);
let day =d.getDay().toString().padStart(2,0);
let da="日一二三四五六".charAt(day);
let info =`${nian}年${yue}月${ri}日星期${da} ${shi}:${fen}:${miao}`
document.getElementById("jst").innerHTML=info;
}
st();
setInterval(st,1000);
</script>
</body>
</html>
jsp文件:
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page import="java.util.Date" %><%--
Created by IntelliJ IDEA.
User: Administrator
Date: 2020/8/10
Time: 20:26
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>今进</title>
</head>
<body>
<% //注意再此处的java代码配合上面的jsp中js代码
SimpleDateFormat jt =new SimpleDateFormat("yyyy年MM月dd日HH:mm:ss");
out.print(jt.format(new Date()));
%>
</body>
</html>
ajax的简单应用的更多相关文章
- html --- ajax --- javascript --- 简单的封装
Ajax的简单封装 Ajax的全称是AsynchronousJavaScriptAndXML 如有疑问请参考:http://zh.wikipedia.org/zh-cn/AJAX 以及传智播客的视频教 ...
- MVC3.0+knockout.js+Ajax 实现简单的增删改查
MVC3.0+knockout.js+Ajax 实现简单的增删改查 自从到北京入职以来就再也没有接触MVC,很多都已经淡忘了,最近一直在看knockout.js 和webAPI,本来打算采用MVC+k ...
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
- 第107天:Ajax 实现简单的登录效果
使用 Ajax 实现简单的登录效果 Ajax是一项使局部网页请求服务器信息,而不需整体刷新网页内容的异步更新技术.这使得向服务器请求的数据量大大减少,而且不会因局部的请求失败而影响到整体网页的加载. ...
- Django ajax的简单使用、自定义分页器
一. ajax初识 1. 前后端传输数据编码格式contentType 使用form表单向后端提交数据时,必须将form表单的method由默认的get改为post,如果提交的数据中包含文件,还要将f ...
- AJAX实现简单的注册页面异步请求
p { margin: 0px; padding: 0px } AJAX简介 (1)AJAX = 异步 JavaScript 和 XML. (2)AJAX 是一种用于创建快速动态网页的技术. (3)通 ...
- 让Ajax更简单
之前写了一篇 ASP.NET中一种超简单的Ajax解决方案 最近把他拿出来更新了下,把demo也搞的更详细了一点 加入了blqw.Json,所以支持更多类型参数和返回值 优化了对exception的处 ...
- ASP.NET MVC Ajax.ActionLink 简单用法
ASP.NET MVC 项目中,如何使用类似于 iframe 的效果呢?或者说 Ajax 局部刷新,比如下面操作: 我们想要的效果是,点击 About 链接,页面不刷新(地址栏不变),然后下面的内容进 ...
- AJAX 的简单用法:
AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX 是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以 ...
- jquery中ajax的简单使用
一.load() 这是最简单的一个函数,传入一个url他会异步加载该url的内容,然后将内容插入每一个选中的元素中,替换掉其中已经存在的内容. 所以最简单的用法是: $("#myDiv&qu ...
随机推荐
- 使用Git GUI Here进行推送时产生报错
许多小伙伴在刚使用git时都会遇到这个问题,在推送一次内容之后,想要再次推送新的数据产生报错 下面就是我们的错误提示: 我们需要先把数据进行更新 找到Remote-->Fetch from--& ...
- 自定义select组件
(声明:当前记录篇参考于该人员 https://www.jb51.net/article/166679.htm ) 一.创建组件 1.新建文件夹:select 2.新建Component: selec ...
- 解决sqlplus中方向键和退格键乱码问题
centos7 1.安装rlwrap软件包 yum install rlwrap -y 2.编辑环境变量 su - oracle vim ~/.bash_profile alias sqlplus=' ...
- git 代码提交到github 回滚到上一版本
1.项目所在目录>git log(查看提交日志) commit idCodeAuthor: XXXXDate: Tue Mar 6 15:10:59 2018 +0800 commit idCo ...
- div垂直居中的4种方式方式
一.使用单元格居中 <!DOCTYPE html> <html> <head> <title>测试</title> </head> ...
- vue iframe网页内嵌及传参
思路 通过域名传参做并加密处理 内嵌页面通过域名来接收参数并解密 外套页面 <iframe :src="url" scrolling="yes" back ...
- vs2019 常用数据结构 纯C语言 头文件实现 (持续更新改错中)单链表,
1.单链表: 1 #pragma once 2 #ifndef _List_H 3 #include<stdio.h> 4 #include<stdlib.h> 5 #defi ...
- 关于flex元素超出父元素的解决方法
左边是label, 右边是input. 设置父级为display:flex; input为flex:1; 然后label 为 white-space: nowrap; 这时input就有可能超出父级. ...
- 用python3操作mysql数据库实现企业级产品参数查询
Python3 MySQL 数据库连接 - PyMySQL 驱动 一.什么是 PyMySQL? PyMySQL 是在 Python3.x 版本中用于连接 MySQL 服务器的一个库,Python2中则 ...
- SignalR基本认识以及使用
SignalR基本认识以及使用 什么是WebSocket.SignalR WebSocket 1.WebSocket基于TCP协议,支持二进制通信,双工通信. 2.性能和并发能力更强. 3.WebSo ...