原生js中用Ajax进行get传参
原生js中用Ajax进行get传参
案例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
input{
width:600px;
height:50px;
display:block;
}
</style>
</head>
<body>
<input type="text" name="id" id="id" value="3"/>
<input type="text" name id="text" value="zhangsan"/>
<input type="text" nane="money" id="money" value="1000"/>
<input type="text" name="bumen" id="bumen" value="web"/>
</body>
</html>
<script>
//用原生写;
//首先,Ajax;封装版 get方式
function ajax(medth,url,fn,data){
var xmlhttp=new XMLHttpRequest;
xmlhttp.open(medth,url+"?"+data,true); //url 和 data要是字符串 ,但是必须是传值时是字符串,这里是变量url data 所以用+拼接起来,中间用必须?连接起来
xmlhttp.send();
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
fn(xmlhttp.responseText);
}
}
}
function $(name){
return document.getElementById(name);
}
var so=$("id").value; // 获取表单的值
var ss=$("text").value;
var mo=$("money").value;
var bu=$("bumen").value;
var js="id="+so+"&name="+ss+"&money="+mo+"&bumen="+bu; //传数据的格式;(不管get还是post通用) &符 表示and的意思 js要是字符串 所以可以用+进行字符串拼接;
console.log(js);
ajax("get","http://192.168.43.229:8088/seven/4.12/admin/02.php",mn,js);
function mn(data){
console.log(data); //在php中获取的数据
}
</script>
<?php
$so=$_GET['id']; //用get获取id的字段 与js中的id一致;
$ss=$_GET['name'];
$mo=$_GET['money'];
$bu=$_GET['bumen'];
$arr=[];
array_push($arr,$so,$ss,$mo,$bu); //将他们放在数组里
var_dump($arr); //只能用var_dump展示出来;
?>
原生js中用Ajax进行get传参的更多相关文章
- 用原生js实现ajax、jsonp
转载: http://www.cnblogs.com/yangheng/p/6065910.html 一.原生js实现ajax $.ajax({ url: '', type: 'post', data ...
- 原生js实现Ajax
一般来说,大家可能都会习惯用JQuery提供的Ajax方法,但是用原生的js怎么去实现Ajax方法呢? JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataT ...
- 原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- [javascript]原生js实现Ajax
一.首先看JQuery提供的Ajax方法: $.ajax({ url: , type: '', dataType: '', data: { }, success: function(){ }, err ...
- js中使用进行字符串传参
在js中拼接html标签传参时,如果方法参数是字符串需要加上引号,这里需要进行字符转义 <a href='javascript:addMenuUI("+"\"&qu ...
- ajax的data传参的两种方式
ajax的data传参的两种方式 本文为转载. 1.[javascript] view plain copy /** * 订单取消 * @return {Boolean} 处理是否成功 */ func ...
- 使用原生js写ajax
// 使用原生js 封装ajax // 兼容xhr对象 function createXHR(){ if(typeof XMLHttpRequest != "undefined") ...
- 表单验证--通过原生js模仿ajax的异步交互
今天给大家带来个福利,我也是刚刚学习的很实用的一个东西,通过原生js模仿ajax的异步交互. 我的博客只是给那些新手看的大神勿喷,写的不好可留言,请指出. 因为当初自己学的时候一个问题不会找人问,知道 ...
- 原生JS实现Ajax及Ajax的跨域请求
前 言 如今,从事前端方面的程序猿们,如果,不懂一些前后台的数据交互方面的知识的话,估计都不太好意思说自己是程序猿.当然,如今有着许多的框架,都有相对应的前后台数据交互的方法. ...
随机推荐
- 注册一个gitHub
GitHub 是一个面向开源及私有软件项目的托管平台,因为只支持 Git 作为唯一的版本库格式进行托管,故名 GitHub. GitHub 于 2008 年 4 月 10 日正式上线,除了 Git 代 ...
- liunx 安装mysql数据库
yum 安装rz/sz yum install -y lrzsz 卸载Mariadb数据库 查询所安装的MariaDB组件: [root@localhost logs]# rpm -qa | gr ...
- VMware vSphere Client(Vcenter)上传ISO镜像
.登录Vcenter后选择"数据存储与数据存储集群" .选择存储的路径,右键-选择“浏览数据存储” .点击上传图标,并上传指定的ISO文件
- Java线程池ThreadPoolExecutor&&Executors
一.先看看传统的开启线程. new Thread(new Runnable() { @Override public void run() { } }).start(); 缺点: 1.每次new Th ...
- 调试nodejs项目接口,使用Posman,用req.body拿不到数据
近日在postman 上面测试nodejs写的post接口,发现后台接受不到数据. 很多人其实不知道怎么postman 上面GET和POST怎么使用的 Postman接口操作 1.GET请求操作: 2 ...
- Spring mvc初学
转自:http://www.cnblogs.com/bigdataZJ/p/springmvc1.html 从今天起,准备好好审视并学习Spring mvc. 虽然从学java的第一个程序——hell ...
- Scrapy爬虫框架中的两个流程
下面对比了Scrapy爬虫框架中的两个流程—— ① Scrapy框架的基本运作流程:② Spider或其子类的几个方法的执行流程. 这两个流程是互相联系的,可对比学习. 1 ● Scrapy框架的基本 ...
- A Network-based End-to-End Trainable Task-oriented Dialogue System
abstract 让机器去和人类自然的交谈是具有挑战性的.最近的任务型对话系统需要创造几个部分并且通常这需要大量的人工干预,或者需要标注数据去解决各部分训练的问题.在这里我们提出了一种端到端的任务型对 ...
- 利用Java获取ip地址
方法1 public static String getIp2(HttpServletRequest request) { String ip = request.getHeader("X- ...
- 剑指Offer 3. 从尾到头打印链表 (链表)
题目描述 输入一个链表,按链表值从尾到头的顺序返回一个ArrayList. 题目地址 https://www.nowcoder.com/practice/d0267f7f55b3412ba93bd35 ...