ajax有关的问题

ajax有关的问题：

1：通过事件或定时器触发

2：表单的提交按钮类型不能是submit，form元素内不用填写method和action

3：调用：

button.onclick = function(){
    ajax({
        method : 'post',           //以post方式提交数据
	url : 'blog.php',         //提交到的地址，在blog.php里处理数据
	data : serialize(form), //表单数据 表单序列化
	success : function (text) {   //表单提交按钮type属性一定不要是submit
		// 回调函数
	    if(text==1){
        //blog.php里的操作执行成功后
		alert('发文成功');
		//从数据库里查找信息
		ajax({
		    method : 'post',           	//以post方式提交数据
		    url : 'get_blog.php',           //提交到的地址
		    data : {},   					//获取数据
		    success : function (text) {   //表单提交按钮type属性一定不要是submit
		// 回调函数，将返回来的json数据接收过来
		        var json = JSON.parse(text);  
			var html = '';
			for(var i = 0;i<json.length;i++){  //循环获取所有数据
				html += '<div class="content"><h2><em>'+json[i].date+'</em>'+json[i].title+'</h2><p>'+json[i].content+'</p></div>';
                            }
			index.innerHTML = html;	//显示数据
		},
			async : true   //一异步
	});
// 可以在这里设置一些特性 例如：设置cookie，显示用户名，但是刷新后会消失，onload加载时判断是否存在cookie
				}
			},
		    async : true   //一异步
		});
	}

4：blog.php:数据并写入数据库接收

<?php
// 发表文章
	//常量参数
	define('DB_HOST','localhost');     //主机名
	define('DB_USER','blog');          //数据库用户名
	define('DB_PWD','lmm13637064637'); //数据库密码
	define('DB_NAME','blog');          //要连接的数据库的名称
	//连接mysql服务器
	$conn=@mysql_connect(DB_HOST,DB_USER,DB_PWD)or die('数据库连接失败；'.mysql_error());
	//选择指定的数据库，设置字符集
	@mysql_select_db(DB_NAME)or('数据库错误：'.mysql_error());
	@mysql_query('SET NAMES UTF8')or die('字符集设置错误：'.mysql_error());
	$query="INSERT INTO blog_blog(title,content,date)VALUES('{$_POST['title']}','{$_POST['content']}',NOW())";
	mysql_query($query)or die('新增失败！'.mysql_error());
	echo mysql_affected_rows();      //回掉函数
	mysql_close();                   //关闭数据库	
?>

5:get_blog.php:查找数据并获取

<?php
// 显示文章
	//常量参数
	define('DB_HOST','127.0.0.1');     //主机名
	define('DB_USER','blog');          //数据库用户名
	define('DB_PWD','lmm13637064637'); //数据库密码
	define('DB_NAME','blog');          //要连接的数据库的名称
	//连接mysql服务器
	$conn=@mysql_connect(DB_HOST,DB_USER,DB_PWD)or die('数据库连接失败；'.mysql_error());
	//选择指定的数据库，设置字符集
	@mysql_select_db(DB_NAME)or('数据库错误：'.mysql_error());
	@mysql_query('SET NAMES UTF8')or die('字符集设置错误：'.mysql_error());
	// 从中提取三条数据
	$query = mysql_query("SELECT title,content,date FROM blog_blog ORDER BY date DESC LIMIT 0,3")or die('SQL错误'.mysql_error());
	$json = '';
	// 循环得到所有数据并转换为json字符串，并返回
	while (!!$row = mysql_fetch_array($query,MYSQL_ASSOC)) {
		$json .= json_encode($row).',';   //将所有数据转化为json字符串,每条数据以逗号隔开因为用转化成js能用的对象形式，最后多了个逗号
		// {"title":"123","content":"12","date":"2018-06-10 10:04:23"},{"title":"12","content":"1212","date":"2018-06-10 09:32:31"}
	}
	echo '['.substr($json,0,strlen($json)-1).']';  //去除最后一个逗号并转化为数组
	mysql_close();
?>

5：同一个php文件对于不同事件进行不同的操作：

只需要在ajax data对象里传入一个参数区分

js:

ajax({
							method : 'post',      //以post方式提交数据
							url : 'get_skin.php',    //提交到的地址
							data : {
								'type':'set',
								'big_bg':this.getAttribute("big_bg")
							},

php:

if($_POST['type']=='set'){
		// 让原来的图片bg_flag 变成 0
		$query = mysql_query("UPDATE blog_skin SET bg_flag = 0 WHERE bg_flag = 1")or die('SQL错误'.mysql_error());
		// 让传来的图片作为默认图片
		$query = mysql_query("UPDATE blog_skin SET bg_flag = 1 WHERE big_bg='{$_POST['big_bg']}'")or die('SQL错误'.mysql_error());
		
	}

6:步骤3中不仅要在自己发表成功后显示，而且只要加载js就应该显示，所以还要下载onload里，ajax是在事件下触发，不然就失去了意义。

7：虽然发表成功后立即显示，但是别人要刷新才能进入，或者在你发表成功后进入的用户才能看到，因为只在onload事件下，和发表成功的事件下才更新数据，如果想发表成功后别人不用刷新也能看到就要在onload下的ajax添加个定时器，比如0.5秒更新一下数据，这样发表成功后别人也能立即看到，但这样有一个缺点就是无论你有没有发表文章它都是每隔0.5秒从数据库里查找并更新数据大大地增加了数据库服务器的压力，也是ajax的缺点之一。

猜你喜欢