第六周作业

  又一周过去了,用该随笔说明这周的一些成果和遇到的问题。

  辅助教学网页的大部分基本功能都已实现了,是时候写一个漂亮的界面把功能加入了,可是我们却遇到了瓶颈。因为之前我们网页设计是用的一种原型设计工具,可能是不太熟练吧,出来的网页不太美观,而且自动出来的代码也比较杂乱,没有什么参考价值,不适合按照其去设计下去。没时间再重新改了,那就只能加班加点自己重新设计咯(只能说我们最开始分工并不明确,不然也不会到最后又要重新开始这种并行的任务)。我在网上找了许多网页设计的PSD,去学习别人的版面,最后将主页板块按下图排版:

  可能界面比较简陋,但是主要是功能实现,而且目前也没那么多内容可以填充,对基本功能的加入已经足够,进一步美化可以先做出成品后下个版本再慢慢改。

  然后再说说一个运用AJAX的实例吧,对于用户注册账户的时候,虽然我们是要他已学号注册,但是我们不能允许重复注册或者其他恶意注册。。所以当用户输入完他所需注册的账号后,系统会马上进入后台判断该账号是否存在,如果存在,拒绝提交该表单,否则正常注册。

  这是填写学号表单的html代码:<label for = "id">学号</label><input name = "id" type = "text" id = "id"/> <span id = "chk"></span>

 

  当用户光标离开学号那一栏时,进行判断,将输出的内容放在后面的SPAN中

 1 $("#id").blur(function(){ 
 2             $.ajax({ 
 3             url:"check.php", 
 4             type:"POST", 
 5             data:"id="+$("#id").val(),  
 6             success: function(data) 
 7             { 
 8             if(    data == 1)
 9             {
10                 $("#chk").css("color","green");
11                 $("#chk").html("可以注册");
12             }
13             else
14             {    
15                 $('#chk').css("color","red");
16                 $("#chk").html("该用户已存在,不可以注册!");
17                 flag = 0;
18                 return false;
19             } 
20                 }
21             
22             })
23             
24             }); 

  

  后台判断代码check.php 

 1 <?php
 2 
 3 include_once $_SERVER['DOCUMENT_ROOT'].
 4     '/first/includes/db.ini.php';  #连接到数据库
 5     
 6     Function isequal($id)
 7         {
 8         include $_SERVER['DOCUMENT_ROOT'].
 9     '/first/includes/db.ini.php';  #连接到数据库
10             try 
11             {
12                 $sql = 'SELECT id
13                         FROM student 
14                         WHERE id = :id';
15                 $s = $pdo->prepare($sql);
16                 $s->bindValue(':id', $id);
17                 $s->execute();
18                 $result = $s->rowCount();    
19                 if($result == 0)
20                 {
21                     return true;
22                 }
23                 else
24                 {
25                     return false;
26                 }
27             }
28             catch (PDOException $e)
29             {
30                 $output = 'xxxcxx!' . $e->getMessage();
31                 include '../includes/output.html.php';
32                 exit();
33             }
34         }
35         header("Content-type:text/html;charset=UTF-8"); 
36         if($_POST['id']) 
37         { 
38             $user=$_POST['id']; 
39             if(isequal($user)) 
40             echo 1; 
41             else 
42             {
43             echo 0
44             }
45             
46         }
47         
48         
49         

   这样做了以后,虽然可以实时检查出用户名是否出现重复,但是发现还是可以提交注册,因为显示重复后并没有阻止该表单提交。

   搜寻资料后,发现问题可以这样解决。

   定义一个全局变量 var flag = 1;

   写了一个简单的判断函数

 1 function checkform()
 2     {
 3         if(flag == 1)
 4             {
 5             return true;
 6             }
 7         else 
 8         {
 9             flag = 1;
10             return false;
11         }
12     }
13     

    然后在表单FORM中 加入一项onsubmit = "return checkform()" 问题就解决了~

 

    时间已经不多,我们会尽全力提交一份满意的答卷。

原文地址:https://www.cnblogs.com/pcry/p/5385538.html