PHP 3 HTML POST带参数请求 后端返回json格式的数据给前端

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_35713752/article/details/80353936

前端代码

<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8">
		<title>Title</title>
		<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js"></script>
		<style type="text/css">
			button {
				width: 150px;
				height: 50px;
			}
			
			.file {
				margin: 50px;
			}
			
			.content {
				margin: 50px;
			}
			
			.btn_2 {
				position: relative;
				bottom: 20px;
				left: 40px;
			}
		</style>
	</head>

	<body>
		<div class="file">
			<form action="http://gohosts.com/index.php" enctype="multipart/form-data" method="post">
				<input type="file" name="excel_file">
				<button class="btn btn-primary" type="submit">上传</button>
			</form>
		</div>
		<div class="content">
			内容:<input type="text" name="content">
			<button class="btn_2" id="ajaxSubmit" />点我ajax提交表单</button>
			<div class="block" id="block"></div>
		</div>
		<script type="text/javascript">
			//给id为ajaxSubmit的按钮提交表单
			$("#ajaxSubmit").click(function() {
				var data = {
					title: $(" input[ name='title' ] ").val(),
					content: $(" input[ name='content' ] ").val()
				}
				console.log(data)
				$.ajax({
					//几个参数需要注意一下
					type: "POST", //方法类型
					dataType: "json", //预期服务器返回的数据类型
					url: "http://gohosts.com/index.php", //url
					data: data,
					success: function(res) {
						console.log(res); //打印服务端返回的数据(调试用)

						var htm = '';
						for(var i = 0; i < res.length; i++) {
							htm += '<div id="">content:' + res[i].content + '</div>';
						}
						$('#block').html(htm)
					},
					error: function() {
						alert("异常!");
					}
				});
			});
		</script>

	</body>

</html>


后端代码

<?php
    header("Content-Type:text/html;charset=utf8"); 
	header("Access-Control-Allow-Origin: *"); //解决跨域
	header('Access-Control-Allow-Methods:POST');// 响应类型  
	header('Access-Control-Allow-Headers:*'); // 响应头设置 
    $link=mysql_connect("localhost","root","root"); 
    mysql_select_db("new_test", $link); //选择数据库
    mysql_query("SET NAMES utf8");//解决中文乱码问题
	
    $content = $_POST['content'];
	
	//插入数据到数据库 
	$strsql = "insert into arr_content (content) values('$content')";
	//mysql_query() 函数执行一条 MySQL 查询。SELECT,SHOW,EXPLAIN 或 DESCRIBE 都需要用这个函数执行
	$result = @mysql_query($strsql);
	
	
    $q = "SELECT * FROM arr_content"; //SQL查询语句 SELECT * FROM 表名
    $rs = mysql_query($q); //获取数据集
    if(!$rs){die("数据库没有数据!");}
	
	//循环读取数据并存入数组对象
    $dlogs;$i=0;
    while($row=mysql_fetch_array($rs))
    {
        $dlog["content"]=$row["content"];
        $dlogs[$i++]=$dlog;
    }
	
	
    //以json格式返回html页面
    echo urldecode(json_encode($dlogs));
?>


阅读更多

扫码向博主提问

a_靖

博客专家

非学,无以致疑;非问,无以广识
  • 擅长领域:
  • 微信小程序前端开发
  • js
  • 画布
  • 动画
去开通我的Chat快问
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页