JS请求服务器,并返回信息,请求过程中不需要跳转页面

js请求服务器,并返回信息,请求过程中不需要跳转页面

这个可以通过jQuery框架轻松实现,jQuery中包含多种ajax的请求方式,详细可以参考下对应 的API。

你上面定义的按钮类型是submit,如果是在form当中,将会自动提交当前form表单,建议,如果可能的话将其修改为button类型。

下面给出通过jQuery的$.post方式,异步获取服务器的JSON数据。

功能代码:

<script type="text/javascript">
    $(function(){
        // 定义存放服务器返回值的变量
        var jsonData = null;
        $(‘#submitBtn‘).click(function(){
            // 请求的参数
            var params = {};
            $.post(‘json.json‘, params, function(data){
                // 这里data就是返回的JSON对象
                jsonData = data;
                alert(jsonData.name);
            }, ‘json‘);
        });
    });
</script>

完整代码:

<html>
<head>
<style>
</style>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<script type="text/javascript" src="

<script type="text/javascript">
    $(function(){
        // 定义存放服务器返回值的变量
        var jsonData = null;
        $(‘#submitBtn‘).click(function(){
            // 请求的参数
            var params = {};
            $.post(‘json.json‘, params, function(data){
                // 这里data就是返回的JSON对象
                jsonData = data;
                alert(jsonData.name);
            }, ‘json‘);
        });
    });
</script>
</head>
<body>
<div>
    <input type="button" value="提交" id="submitBtn"/>
</div>
</body>
</html>

json.json文件内容:

{
    "name" : "Steven",
    "sex"  : "Male",
    "age"  : 10
}
时间: 2024-08-02 09:18:33

JS请求服务器,并返回信息,请求过程中不需要跳转页面的相关文章

ajax_简单demo。页面存在textbox1和button1,点击按钮,返回服务器的时间,填写在textbox1中。无刷新整个页面。

贴上示例代码,ie中有效(搜狗没效果),其余未测. <html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <script type="text/javascript"> function btnclick() { var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP&quo

Node.js创建服务器和模拟客户端请求

1. 何为服务器 服务器是某种长期运行,等待请求资源的应用程序 2. 常见Web应用架构 3. 如何创建web服务器 Web服务器是使用HTTP协议,等待客户端连接后请求资源的驻守应用程序:HTTP协议是应用层的协议,在传输层依然是使用TCP或者UDP协议,一般来说是使用Socket来绑定TCP或者UDP,总的来说创建服务器就是创建一个Socket: 创建服务器的流程: (1)创建Socket (2)为Socket绑定参数 (3)Socket等候请求 (4)处理请求,返回资源 (5)关闭资源 4

错误集锦1. 编译错误 在编译向该请求提供服务所需资源的过程中出现错误。请检查下列特定错误详细信息并适当地修改源代码

出现上图的错误,是由于使用的是VS2015,vs2015里面 带有这个DLL,所以会使用roslyn去完成编译,在有些云上,不支持roslyn编译的东西,就会报错,所以解决方案就是注释掉 下图红色框框里的东西即可. 来自为知笔记(Wiz)

利用纯JS和HTML Canvas生成随机迷宫过程中产生的有趣的事情

上效果图: #先看生成随机迷宫的代码吧↓ 1 <html> 2 <head> 3 <title>生成随机迷宫v1.0</title> 4 </head> 5 <body> 6 <center style="margin-top: 20px;"> 7 <canvas id="myCan1" title="作者:谢辉"></canvas> 8

WCF异常信息:由于内部错误,服务器无法处理该请求

"WCF异常信息:由于内部错误,服务器无法处理该请求",考评系统实现的过程中,提示出这样的错误,你如何调试,对呀面对如此抽象含糊的提示,跟没有提示一样,表示很无语. 这其实是我们自己把错误提示给遮挡住了,我们看下面配置文件system.serviceModel节点 <system.serviceModel> <behaviors> <serviceBehaviors> <behavior> <!-- 为避免泄漏元数据信息,请在部署前

关于纯xmlhttprequest请求服务器数据

今天我们的web技术已经相当的完善, 各种前端框架如jquery或者再深一点的工具APIcloud 的使用极大的方便了我们的开发工作. 今天我要分享一个纯javascript的方式来解决请求服务器数据或者异步请求数据来交互的方式. 因为我们的项目前端是ThunderAPP开发的android和IOS移动客户端, 使用完全封闭的APIcloud, 请求的形式都是AJAX api.ajax({ url : urlConstant.baseUrl + urlConstant.getUserMsgUrl

Web服务器-服务器开发-返回浏览器需要的页面 (3.3.2)

目录 1.说明 2.代码 关于作者 @ 1.说明 使用正则表达式,匹配客户端的请求头 获取到请求的路径 返回对应请求路径的文字 可以使用打开对应文件的方式去返回对应的文件 2.代码 from socket import * import re def service_client(new_socket): '''为这个客户端返回数据''' # 1.接收浏览器发送过来的请求,即http请求 #GET /HTTP/1.1 # ... request = new_socket.recv(1024).d

从输入网址到显示网页的过程中发生了什么?

从用户输入一个网址到网页最终展现到用户面前,中间究竟发生了什么?这是一个简单而复杂的问题.大致流程总结如下:1.输入地址2.浏览器查找域名的 IP 地址(这一步包括 DNS 具体的查找过程,包括:浏览器缓存->系统缓存->路由器缓存...)3.浏览器向 web 服务器发送一个 HTTP 请求4.服务器的永久重定向响应(从 http://example.com 到 http://www.example.com)5.浏览器跟踪重定向地址6.服务器处理请求7.服务器返回一个 HTTP 响应8.浏览器

从输入网址到显示网页的过程中发生了什么?(转自88旧港)

转自88旧港 http://www.cnblogs.com/xingyue1988/ 从用户输入一个网址到网页最终展现到用户面前,中间究竟发生了什么?这是一个简单而复杂的问题.大致流程总结如下:1.输入地址2.浏览器查找域名的 IP 地址(这一步包括 DNS 具体的查找过程,包括:浏览器缓存->系统缓存->路由器缓存...)3.浏览器向 web 服务器发送一个 HTTP 请求4.服务器的永久重定向响应(从 http://example.com 到 http://www.example.com)