ajax

Posted 小学员G

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ajax相关的知识,希望对你有一定的参考价值。

 1 <script type="text/javascript">
 2     $.ajax({
 3         url:"chuli.php", //处理页面地址
 4         data:{code:"n001"},//传递的数据,提交数据
 5         type:"POST", //提交方式
 6         dataType:"TEXT", //返回值的类型
 7         success:function(data){ //回调函数
 8                 alert(data);
 9             },
10         error:function(){  //处理出错执行
11             
12             }
13         
14         });
15 </script>

练习--查看详情

 1 <input type="button" value="显示" id="btn" />
 2 
 3 <table width="100%" border="1" cellpadding="0
 4  " cellspacing="0">
 5      <tr id="sj">
 6         <td>代号</td>
 7         <td>名称</td>
 8         <td>操作</td>
 9 
10     </tr>
11     
12     <tbody id="tb">
13     </tbody>
14     
15     
16 </table>
17 
18 //异步处理
19 
20 
21 
22 <script type="text/javascript">
23 
24 $("#btn").click(function(){
25     
26     $.ajax({
27             url:"nationchuli.php",
28             dataType:"TEXT",
29             success: function(data){
30                 var hang = data.split("|");
31                 var str = "";
32                 
33                 for(var i=0;i<hang.length;i++)
34                 {
35                     var lie = hang[i].split("^");
36                     str = str+"<tr><td>"+lie[0]+"</td><td>"+lie[1]+"</td><td><span class=‘sc‘ bs=‘"+lie[0]+"‘>删除</span><span class=‘xq‘ bs=‘"+lie[0]+"‘>查看详情</span></td></tr>";
37                     
38                 }
39             
40                 $("#tb").html(str);
41                 
42                 //加事件
43                 $(".sc").click(function(){
44                     alert("aa");
45                     })
46                 //查看详情
47                 $(".xq").click(function(){
48                     
49                 var code = $(this).attr("bs");
50                 $.ajax({
51                     
52                     url:"xqchuli.php",
53                     data:{code:code},
54                     type:"POST",
55                     dataType:"TEXT",
56                     success: function(data){
57                         var lie1 = data.split("^");
58                         
59                         var str = "<div>代号:"+lie1[0]+"</div><div>名称:"+lie1[1]+"</div>";
60                         var btn ="<input type=‘button‘ value=‘确定‘ class=‘qd‘ />";
61                         
62                         var tc = new Window({
63                             
64                             title:"详细信息",
65                             content:str,
66                             buttons:btn
67                             
68                             });
69                             
70                         $(".qd").click(function(){
71                                 $(".zhuti").remove();
72                                 $("#zz").remove();
73                             })
74                         
75                         }
76                     
77                     });
78                 
79                 })
80             }
81         });
82         
83         
84     
85     
86     })
87 </script>

 

以上是关于ajax的主要内容,如果未能解决你的问题,请参考以下文章

Javascript代码片段在drupal中不起作用

前端面试题之手写promise

Ajax 片段元标记 - Googlebot 未读取页面内容

执行AJAX返回HTML片段中的JavaScript脚本

javascript AJAX片段

Spring MVC 3.2 Thymeleaf Ajax 片段