清空文本框的逗号和分号问题

当我输入test按下逗号后的显示，我js代码已经清空了$this.val('');但是这个逗号怎么会还在呢？

解决方案 »

  1.   

    要在keyup里面做清除，因为keydown的时候字符还没有键入文本框，keyup的时候才键入的
      

  2.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"type="text/javascript"></script>
    <style type="text/css">
    .recipients{ width:408px; display:block; height:auto; border:1px solid #ccc; padding:2px;}
    .un_selector input{width:95px;height:17px;border-width:0;outline:none;}
    .un_selector span{float:left;margin:1px 2px 1px 0;width:100px;height:19px;line-height:19px; display:block;background:#F7F6ED url(http://img.bbs.csdn.net/upload/201402/13/1392256213_883907.png) no-repeat 0 0;color:#369;overflow:hidden;}
    .un_selector em{padding-left:5px;width:80px; margin:0px; padding:0px; FONT-STYLE: normal; font-size:12px; font-weight:normal;}
    .un_selector .x{float:right;width:15px;height:19px;background:url(http://img.bbs.csdn.net/upload/201402/13/1392256213_883907.png) no-repeat 100% -19px;text-indent:-9999px;overflow:hidden; cursor:pointer;}
    .un_selector .x:hover{background-position:100% -38px;}
    .cl{ clear:both;}
    .bf{border: 1px solid #92BBDF;}
    </style>
    <script type="text/javascript">
    $(function(){
        $("#username").focus(function(){
    $(".recipients").addClass("bf");
    }).blur(function(){
    $(".recipients").removeClass("bf");
    });

        $("#username").bind("keyup",function (event) {
    var $this=$(this);
    var this_v=$this.val().replace(/[,|;|\s]+/g,"");
    //按下回车键、逗号、分号
    if (event.keyCode == 13 || event.keyCode == 188 || event.keyCode == 59) {
        if(isExist(this_v)){
    alert("已经存在" + this_v);
    $this.val("");
    return;
    }

    var id='str' + Math.floor(Math.random() * 10000);
    var str="<span id=\""+id+"\"><a class=\"x\">删除</a><em class=\"z\">"+this_v+"</em></span>";
         $this.before(str);
    $this.val('');

    $(".x","#"+id).bind("click",function(){
    $("#"+id).remove();
    $this.show();
    });

    //限制收件人最多12位
    if($("span",".un_selector").length >= 12){
    $this.hide();
    }
    }
    //按下删除键
    if (event.keyCode == 8 && this_v == '') {
    $("span:last",".un_selector").remove();
    $this.show();
    }
        });
    });
    function isExist(userName){
        var i=0;
    $("span em",".un_selector").each(function(){
    if($(this).text()==userName)
    i++;
    });
    return (i>0)?true:false;
    }
    </script>
    </head>
    <body><div class="recipients">
    <div class="un_selector" onclick="$('username').focus();">
    <input id="username" type="text" autocomplete="off" name="username">
    </div>
    <div class="cl"></div>
    </div></body>
    </html>