Heim > Backend-Entwicklung > PHP-Tutorial > php +ajax +sql 实现数据交互

php +ajax +sql 实现数据交互

WBOY
Freigeben: 2016-06-23 13:36:24
Original
906 Leute haben es durchsucht

1.首先新建个sql表,表内容如上所示:


2.新建个公用文件conn.php来链接数据库:

<strong><?php </strong> header(<strong>"Content-Type:text/html;charset=utf8"</strong>);//申明编码格式 $conn=mysql_connect(<strong>"localhost"</strong>,<strong>"root"</strong>,<strong>"aaaaaa"</strong>) <strong>or die</strong>(<strong>"</strong><strong>数据库连接错误</strong><strong>"</strong>.mysql_errno());//连接sql mysql_select_db(<strong>"phptest"</strong>,$conn); mysql_query(<strong>'SET NAMES UTF8'</strong>) <strong>or die</strong>(<strong>'</strong><strong>字符集设置错误</strong><strong>'</strong>.mysql_error());//设置输入的字符集编码 <strong>?></strong></strong>
Nach dem Login kopieren
<strong>3.php服务端提供给前端ajax数据接口,新建文件phptoAJAX。php</strong>
Nach dem Login kopieren
<pre class="n"><strong><?php</strong> <strong>require_once</strong>(<strong>"conn.php"</strong>);//导入公用文件 $query=mysql_query(<strong>"SElECT * FROM txt"</strong>) <strong>or die</strong>(<strong>"</strong><strong>错误提示:</strong><strong>"</strong>.mysql_error()); $jsonArray=<strong>array</strong>();//新建数据用于接收数据库每行对应的数据组 <strong>while</strong>($rows=mysql_fetch_array($query)) {
Nach dem Login kopieren
 //处理数据库里面的自动对应的内容  $rows[<strong>'content'</strong>]=mb_substr(strip_tags(htmlspecialchars_decode($rows[<strong>'content'</strong>])),0,100,<strong>"utf-8"</strong>);  //把数据库的内容添加到新建数组中  
Nach dem Login kopieren
 array_push($jsonArray,$rows);//注意这里是$rows  } <strong>echo </strong>json_encode($jsonArray);//转换成json传递给前端
Nach dem Login kopieren
4.新建phpToAJAX.HTML前端接收数据,这里我用jquery封装好的ajax方法,执行后的页面如下图所示:
Nach dem Login kopieren
<pre class="n"><!DOCTYPE <strong>html</strong>><<strong>html</strong>><<strong>head </strong><strong>lang=</strong><strong>"en"</strong>>    <<strong>meta </strong><strong>charset=</strong><strong>"UTF-8"</strong>>    <<strong>title</strong>></<strong>title</strong>>    <<strong>script </strong><strong>type=</strong><strong>"text/javascript" </strong><strong>src=</strong><strong>"jquery-1.8.3.min.js"</strong>></<strong>script</strong>></<strong>head</strong>><<strong>body</strong>><<strong>ul </strong><strong>id=</strong><strong>"list"</strong>><pre class="n">  <!--数据将在这里显示-->
Nach dem Login kopieren
ul><script type="text/javascript"> $(function(){ $.ajax({ type: "post",//传递方法 url: "phpToAJAX.php",//数据接口 dataType: "json",//接收格式 success: function(msg)//如果接收成功执行以下 { var li=""; for(var i =0;ilength-1;i++)//这里是限定10个 { li+="
  • "+msg[i]['title']+"

    "+msg[i]['content']+"...]+"' target='_blank'>详细

  • "; } $("#list").html(li); }, error:function()//如果接收不成功执行以下
                {                    console.log(<strong>"</strong><strong>链接错误</strong><strong>"</strong>)            }        });    });</<strong>script</strong>></<strong>body</strong>></<strong>html</strong>>
    Nach dem Login kopieren
    5.点击上一步图中所示的“详细”链接,可查看对应的文章内容,新建phpArtcle.php文件
    Nach dem Login kopieren
    <strong><?php</strong> <strong>require_once</strong>(<strong>"conn.php"</strong>); $id=$_GET[<strong>'art'</strong>];//接收前端上传的数据
    Nach dem Login kopieren
    <pre class="n">//查询数据库对应的内容
    Nach dem Login kopieren
    $query=mysql_query("SELECT * FROM txt WHERE  id='$id'") or die("文章错误:".mysql_error());
    Nach dem Login kopieren
    //遍历数组,显示内容
    Nach dem Login kopieren
    if($rows=mysql_fetch_array($query)){ echo "

    ".$rows['title']."

    "; echo "
    ".htmlspecialchars_decode($rows['content'])."
    ";}

    ------------------- 完毕 -----------------------




    Verwandte Etiketten:
    Quelle:php.cn
    Erklärung dieser Website
    Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
    Beliebte Tutorials
    Mehr>
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage