一、提交数据
html部分:
1 <html> 2 <head> 3 <meta charset="UTF-8"> 4 <title>JQueryAjax+PHP</title> 5 <script type="text/javascript" src="https://code.jquery.com/jquery-3.0.0.min.js"></script> 6 </head> 7 <body> 8 用户名:<input type="text" id="username" name="username" /><br> 9 密码:<input type="password" id="password" name="password" /><br> 10 <button type="button" class="butn">ajax提交</button><br> 11 <span class="con"></span> 12 <script type="text/javascript"> 13 $(document).ready(function(){ 14 15 $(".butn").click(function(){ 16 var username = $("#username").val(); 17 var password = $("#password").val(); 18 $.ajax({ 19 url: "ht.php", 20 type: "POST", 21 data:{name:username,pwd:password}, /* 另外一种写法:"name=username&pwd=password", */ 22 dataType: "json", 23 error: function(){ 24 alert(‘Error loading XML document‘); 25 }, 26 success: function(data,status){//如果调用php成功 27 alert(status); 28 alert(data); 29 $(‘.con‘).html("用户名:"+data[‘name‘]+"密码:"+data[‘password‘]); 30 } 31 }); 32 }) 33 34 }) 35 </script> 36 </body> 37 </html>
php部分:
1 <?php 2 3 $name = $_POST[‘name‘]; 4 $pwd = $_POST[‘pwd‘]; 5 6 $arr = array(‘name‘=>$name,‘password‘=>$pwd); 7 //这里进行一个些操作,如数据库交互等 8 9 echo json_encode($arr); //json_encode方式是必须的
二、提交表单