原生js中用Ajax进行get传参
Posted Web引领者
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了原生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传参的主要内容,如果未能解决你的问题,请参考以下文章