欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

第二张卡小结 underscoreajax正则表达式button

程序员文章站 2022-07-14 08:57:36
...

第一张卡完成以后大致知道了使用party_bid的流程,haml编写页面,js控制后台,css引入样式。由于处理信息那部分不太懂,所以先做活动报名页面开始按钮的变化部分,在这一块遇到的问题是:

一开始我在js里给start_button设置了初值

 $scope.start_end="start"(按钮为“开始”)
 $scope.button_disable=false(可点状态)

 补充一下,start_button 我用ng-switch来实现功能的

.header-right(ng-switch="start_end")
   %button.btn.btn-4(ng-tap ='start_sign_up()' ng-switch-when='start'ng-disabled="button_disable")开始
   %button.btn.btn-4(ng-tap ='end_sign_up()' ng-switch-when='end' ng-disabled="button_disable")结束

 所以,通过if语句判断条件来显示“开始”按钮可点,“开始”按钮不可点,“结束”按钮可点三种状态,

function judge_sign_up_event_name(){
        var sign_up_event_name=localStorage.sign_up_event_name(取存储在localstorage里的正在报名页面的名称)
        var list_now=localStorage.list_now(取存储在localstorage里的进入活动页面的活动名称的名称)

       if(!sign_up_event_name)(判断为空、undefined、false)
       {
            $scope.start_end="start"
            $scope.button_disable=false
            return;
        }

        if(sign_up_event_name!=list_now){
            console.log(sign_up_event_name,1)
            $scope.start_end="start"
            $scope.button_disable=true
            return;
       }
        else{

            $scope.start_end="end"
            $scope.button_disable=false
        }

    }

 因为之前用不是特别明白getItem()及setItem()的使用方法使得多次存放sign_up_event_name 为undefined的值,所以一直实现不了其功能,getItem()得到数据库中的value,但并不改变它,

var sign_up_event_name=localStorage.sign_up_event_name(取字符串)
var user_messages=JSON.parse(localStorage.getItem("user_messages"))(取数组)

setItem()当数据库中value改变后在存进库中

localStorage.setItem("user_messages",JSON.stringify(user_messages));(存数组)
localStorage.setItem("user_messages",user_messages);(存字符串)

 删除多余的setItem()后,又删去了默认的初始值(“开始”按钮可点状态)就不存在刷新页面所有的状态都还原为(“开始”按钮可点状态)。

状态解决之后是活动列表页面的正在报名的活动背景颜色为黄色问题,只是自己在index里写了个class然后引用了一下。

在处理报名信息这一部分,首先用到了正则表达式(当检索某个文本时,可以使用它来描述要检索的容),由于没有接触过,在w3c里面学习了一下

i	执行对大小写不敏感的匹配。
g	执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
m	执行多行匹配。
\w	查找单词字符。
\W	查找非单词字符。
\d	查找数字。
\D	查找非数字字符。
\s	查找空白字符。
\S	查找非空白字符。
\b	匹配单词边界。
\B	匹配非单词边界。
\0	查找 NUL 字符。
\n	查找换行符。
\f	查找换页符。
\r	查找回车符。
\t	查找制表符。
\v	查找垂直制表符。
\xxx	查找以八进制数 xxx 规定的字符。
\xdd	查找以十六进制数 dd 规定的字符。
\uxxxx	查找以十六进制数 xxxx 规定的 Unicode 字符。

 而且由于在电脑上用console.log()的方法接收信息,所以事先给了一条短信,其格式是哈希,需要剥开它

找到需要的报名人姓名以及联系电话

notify_message_received({"messages":[{"create_date":"Tue Jan 15 15:28:44 格林尼治标准时间+0800 2013","message":" b m 仝键","phone":"18733171780"}]})

"messages"是一个key,后面{}包着的是它的value[{"create_date":"Tue Jan 15 15:28:44 格林尼治标准时间+0800 2013","message":" b m 仝键","phone":"18733171780"}]一个数组,

数组里有包了一个哈希{"create_date":"Tue Jan 15 15:28:44 格林尼治标准时间+0800 2013","message":" b m 仝键","phone":"18733171780"}:

create_date,message,phone是key;Tue Jan 15 15:28:44 格林尼治标准时间+0800 2013, b m 仝键,18733171780是各自的value.

 

得到有用的信息后就是把它显示到报名页面上,之前写了个很长的for循环

if(user_messages!=null&&sign_up_event_name!=list_now){
   for(i=0;i<user_messages.length;i++){
      if(user_messages[i].one_event_name==list_now){
         var this_sign_up_messages=JSON.parse(localStorage.getItem("this_sign_up_messages")) || []
         this_sign_up_messages.push(user_messages[i]);
         localStorage.setItem("this_sign_up_messages",JSON.stringify(this_sign_up_messages));
           }
  }

 后来发现特别的麻烦,而且是加载页面时就运行,每刷新一次页面的内容就多被遍历一次,所以改用_.filter

 var start_this_page_messages= _.filter(user_messages, function(user_messages)
             {return user_messages.one_event_name==list_now; });//var 名字=_.filter(数组或localstorage,function(与前面的相同){return 条件})

这是用到了 underscore 里的内容,下次用到其他的方法再继续学习。