• php获取前端ajax数据对服务器json文件进行增改

    首先ajax读取服务器json文件获取json内容总数。
    先说添加内容：ajax将json内容总数+1作为自增id以及input框中内容传给dujson.php。
    php新建数组，将接受到的内容及id放进去，转换成json格式写入json文件。
    下面是参考文章
    php操作json文件
    PHP处理JSON数据
    前端在html页面与html页面中参数的传递方法
    php 数组 array_search,php array_search()函数的使用详解

    $origin = json_decode(file_get_contents('s.json'), true);
//在数组里添加内容
  $origin[] = array(
    'id' => $zs,
    'name' => $user,
	'where'=>$where,
   
  );
// 再把PHP数组转为JSON字符串
  $json = json_encode($origin);
 // 写入文件
   file_put_contents('s.json', $json);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12

    然后是修改：点击需要修改的行超链接，将id传给gai.html。gai.html中的ajax将修改的内容及id传给xiugai.php。xiugai.php收到数据后先读取服务器json文件，然后转化成php数组后进行遍历，

     foreach ($data as $item){
	echo $item['id'];
		if($item['id']==$xiugaiid){
		$index = array_search($item, $data);
		echo $item['where'];
  			echo $item['name'];
			//$item['name']=$xiun;
			//$item['where']=$xiuw;
			echo "yes----",$index,"...";
			$data[$index]['id']=$xiugaiid;
			$data[$index]['name']=$user;
			$data[$index]['where']=$where;
			$json = json_encode($data);
			file_put_contents('s.json', $json);

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14

    如果找到需要修改的id后

    $index = array_search($item, $data);
$data[$index]['id']=$xiugaiid;

    • 1
    • 2

    用array_search找出是第几个数组，将这个json内容进行修改，最后重新将整个数组转成json，写进服务器json文件中。
    下面是完整代码
    s.json

    [{"id":"1","name":"\u82f9\u679c","where":"\u5e8a"},{"id":"2","name":"4","where":"4"},{"id":"3","name":"\u68a8","where":"\u95e8\u53e3"}]

    • 1

    du.html

     
DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">  

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">script>
<title>ServletJsontitle>  
 

script>
<style>


body {
	background-color:#a9e3ee;
}
table{border:1px solid black;font-size:60px;}
table tr:nth-child(odd)
{
    background: #ccc;
}
/*设置偶数行颜色*/
table tr:nth-child(even)
{
    background: #a9e6ee;
}

tr{border:1px solid black;}
td{border:1px solid black;}
style>
<head runat="server">
     <title>title>
     <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js" type="text/javascript">script>
     <script type="text/javascript">
     var zongshu;
     $.ajax({
                url: "s.json",//同文件夹下的json文件路径
                type: "GET",//请求方式为get
                dataType: "json", //返回数据格式为json
                success: function (data) {//请求成功完成后要执行的方法 
                    //data.push(cc);
                    //var c=eval("("+data+")");
                    console.log(data);
                    zongshu=data.length;
                    //console.log(c);
				for (var i=0;i<data.length;i++){
				var na=data[i].name;
				var wh=data[i].where
				var id=data[i].id;
				var text = document.createTextNode("物品名称——————"+na);
				var text1 = document.createTextNode("放在哪里——————"+wh);
				var tr = document.createElement("tr");
				var tr1 = document.createElement("tr");
				var td = document.createElement("td");
				var td1 = document.createElement("td");
				var td2 = document.createElement("td");
				var td3 = document.createElement("td");
				var td4 = document.createElement("td");
				td.innerHTML="物品名称";
				td4.innerHTML='+id+'"">物品id'+id+'';
				td1.innerHTML=na;
				td2.innerHTML="放在哪里";
				td3.innerHTML=wh;
				var tb=document.getElementById("tb");
				//var p=document.createElement("p");
  //var p1=document.createElement("p");
 
    
 //p.innerHTML="物品名称："+na;//(text);
  //p1.innerHTML="放在哪里:"+wh;//(text);

    tr.appendChild(td);//cd2后添加的div加载p标签
    tr.appendChild(td2);//cd2后添加的div加载p标签
    tr.appendChild(td4);//cd2后添加的div加载p标签
    tr1.appendChild(td1);//cd2后添加的div加载p标签
    tr1.appendChild(td3);//cd2后添加的div加载p标签
    tb.appendChild(tr);//cd2后添加的div加载p标签
    tb.appendChild(tr1);//cd2后添加的div加载p标签
    //div.appendChild(p1);

				
				console.log(na,wh);
				}
                
                						}
                })
                
         //var sz=[];
         function gai(p){    
         console.log(p) 
            var na=$("#name").val();
            var wh=$("#where").val();
            sz.push({name:na,where:wh});
            $.ajax({
                url: "s.json",//同文件夹下的json文件路径
                type: "GET",//请求方式为get
                dataType: "json", //返回数据格式为json
                success: function (data) {//请求成功完成后要执行的方法 
                    //data.push(cc);
                    //sz.push(data);
                    //console.log(sz);
                    

                }
                })
           } 
   
            
            function tj(){
            
            var na=$("#name").val();
            var wh=$("#where").val();
            console.log(na,wh,zongshu);
            //var dataString = JSON.stringify(sz);
            //console.log(dataString);
             $.ajax({
            type: "post",      //get or post  个人感觉post安全很多
            url: "dujson.php",   // 目的url
            dataType: "json",  //数据类型  可以有很多种
            //data: {s:dataString},   //传输的数据  在验证文件接受
            data:{name:na,where:wh,zsd:zongshu},
            success: function(res){   //请求成功后的回调函数
                console.log(res);
                console.log("输出");
            }
        });
}
            
     script>
 head>
 <body>
    <form method="post" action="">
        <div>物品名称
     <input type="text" id="name" name="name" />
     放在哪里
      <input type="text" id="where" >
     <input type="submit" id="button"  value="form" />
     
     div>
      
    form>
     <button type="button" onclick="tj()">ajaxbutton>
     <button type="button" onclick="zs()">zsbutton>
     <div id="main">
     <table id="tb">
     
     table>
     div>
 body>
 html>

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79
    • 80
    • 81
    • 82
    • 83
    • 84
    • 85
    • 86
    • 87
    • 88
    • 89
    • 90
    • 91
    • 92
    • 93
    • 94
    • 95
    • 96
    • 97
    • 98
    • 99
    • 100
    • 101
    • 102
    • 103
    • 104
    • 105
    • 106
    • 107
    • 108
    • 109
    • 110
    • 111
    • 112
    • 113
    • 114
    • 115
    • 116
    • 117
    • 118
    • 119
    • 120
    • 121
    • 122
    • 123
    • 124
    • 125
    • 126
    • 127
    • 128
    • 129
    • 130
    • 131
    • 132
    • 133
    • 134
    • 135
    • 136
    • 137
    • 138
    • 139
    • 140
    • 141
    • 142
    • 143
    • 144
    • 145
    • 146
    • 147
    • 148
    • 149
    • 150
    • 151

    dujson.php

    
// 从文件中读取数据到PHP变量
$user = $_POST['name'];
$where =$_POST['where'];
$zs =$_POST['zsd'];
$id=$zs+1;#加一是因为整个json大小总数从一开始，加一是为了id自增
$s=array("ok"=>"cc");
$s['c']=$user;
$s['a']=$where;
$s['d']=$zs;
echo json_encode($s);

function c($cd){
echo $cd;
 $constans =file_get_contents('s.json');
 // 把JSON字符串转成PHP数组
 $data=json_decode($constans,true);
 //用var_dump() 显示出来看看
 var_dump($data);
 echo '

    '    ;
 //foreach读取所有
  foreach ($data as $item){
  	//echo $item['id'];
  	echo $item['name'];
  }
    echo '

    '    ;
 //读取具体内容，读取第一个name
   echo  $data[0]['name'];}
$d=0;
//c($d);

function xieru($zs,$user,$where){
$origin = json_decode(file_get_contents('s.json'), true);
//在数组里添加内容
  $origin[] = array(
    'id' => $zs,
    'name' => $user,
	'where'=>$where,
   
  );
// 再把PHP数组转为JSON字符串
  $json = json_encode($origin);
 // 写入文件
   file_put_contents('s.json', $json);
}
xieru($id,$user,$where);
?>
 

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48

    gai.html

     
DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">  

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">script>
<title>ServletJsontitle>  
 

script>
<style>


body {
	background-color:#a9e3ee;
}
table{border:1px solid black;font-size:60px;}
table tr:nth-child(odd)
{
    background: #ccc;
}
/*设置偶数行颜色*/
table tr:nth-child(even)
{
    background: #a9e6ee;
}

tr{border:1px solid black;}
td{border:1px solid black;}
style>
<head runat="server">
     <title>title>

 head>
 <body>
 <form method="post" action="">
        <div>物品名称
     <input type="text" id="name" name="name" />
     放在哪里
      <input type="text" id="where" >
     <input type="submit" id="button"  value="form" />
     
     div>
      
    form>
     <button type="button" onclick="tj()">ajaxbutton>
     <button type="button" onclick="zs()">zsbutton>
     <div id="main">
 body>
 html>
<script type="text/javascript">
	//在页面初始化的时候 读取url请求中的数据 解析到数据 并赋值到全局变量中
	var id;
	$(document).ready(function() {
	var param=window.location.href.split("=")[1];
	console.log(param);
	id=param;
	});
	function tj(){
	var na=$("#name").val();
            var wh=$("#where").val();
            console.log(na,wh,id);
            //var dataString = JSON.stringify(sz);
            //console.log(dataString);
             $.ajax({
            type: "post",      //get or post  个人感觉post安全很多
            url: "xiugai.php",   // 目的url
            dataType: "json",  //数据类型  可以有很多种
            //data: {s:dataString},   //传输的数据  在验证文件接受
            data:{name:na,where:wh,zsd:id},
            success: function(res){   //请求成功后的回调函数
                console.log(res);
                console.log("输出");
            }
        });
        }
	script>


    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75
    • 76
    • 77
    • 78
    • 79

    xiugai.php

    在<?php
// 从文件中读取数据到PHP变量
$user = $_POST['name'];
$where =$_POST['where'];
$xiun="c";
$xiuw="c";
$xiugaiid =$_POST['zsd'];
//$id=$zs+1;#加一是因为整个json大小总数从一开始，加一是为了id自增
$s=array("ok"=>"cc");
$s['c']=$user;
$s['a']=$where;
$s['d']=$zs;

//$xiugaiid=3;
$constans =file_get_contents('s.json');
 // 把JSON字符串转成PHP数组
 $data=json_decode($constans,true);
echo $data[0]['id'];

function e($xiugaiid,$user,$where){
 $constans =file_get_contents('s.json');
 // 把JSON字符串转成PHP数组
 $data=json_decode($constans,true);
 //用var_dump() 显示出来看看
 //var_dump($data);
 //echo '

    ';    
 //foreach读取所有
  foreach ($data as $item){
	echo $item['id'];
		if($item['id']==$xiugaiid){
			echo $item['where'];
  			echo $item['name'];
			$index = array_search($item, $data);
			//$item['name']=$xiun;
			//$item['where']=$xiuw;
			echo "yes----",$index,"...";
			$data[$index]['id']=$xiugaiid;
			$data[$index]['name']=$user;
			$data[$index]['where']=$where;
			$json = json_encode($data);
			file_put_contents('s.json', $json);
			}
			else{
				echo "no----";
			}
  	
	}

}
e($xiugaiid,$user,$where);
echo json_encode($s);
function c(){

$origin = json_decode(file_get_contents('s.json'), true);
//在数组里添加内容
  $origin[] = array(
    'id' => $zs,
    'name' => $user,
	'where'=>$where,
   
  );
// 再把PHP数组转为JSON字符串
  $json = json_encode($origin);
 // 写入文件
   file_put_contents('s.json', $json);
}
?>
 

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
  • 相关阅读:
    2024年消防设施操作员考试题库及答案
    git am冲突解决办法
    Unity接入SQLite (一):SQLite介绍
    数据结构-二叉查找树(BST)
    天眼查数据采集、分析、深度挖掘
    GPT实战系列-如何让LangChain的Agent选择工具
    大模型引领未来：探索其在多个领域的深度应用与无限可能【第三章、医疗领域：大模型助力医疗健康创新】
    【LeetCode刷题笔记】链表
    找单身狗2
    数据结构实验1
  • 原文地址：https://blog.csdn.net/weixin_40938312/article/details/127587754