Question

我不希望我的用户使用＆＃34;！@＃$％^＆amp; *（）_ +＆＃34;等字符注册他/她的名字。我应该如何使用jQuery和AJAX？

这是我的代码：

    function registerDialog(){ 

var message = '';

if(loginBox != ''){ 
    $.modal.close();
}


var html =  

             '<div>'
             +'<h4 style="background:#DADEE7;padding:10px;border:1px solid #ccc;"><i class="fa fa-chevron-circle-right "></i> Register</h4>'
             +'<input type="email" id="emailBox" placeholder="Email Address" style="width:90%; margin:10px auto 3px 10px;"/>'
             +'<input type="password" id="passwordBox" placeholder="Password" style="width:90%; margin:10px auto 3px 10px;"/>'
             +'<input type="text" id="realNameBox" style="width:90%;margin:10px auto 10px 10px;" placeholder="Complete Name."style="width:90%; margin:10px auto 3px 10px;" onkeypress="return restrictCharacters(this, event, alphaOnly);" />'
             +'<p id="infoBox" style="width:90%;margin-left:10px;margin-bottom:5px;"></p>'
             +'<p id="infoBox2" style="width:90%;margin-left:10px;margin-bottom:5px;"></p>'
             +'<p style="text-align:right;">'
             +'<button style="padding:5px;margin-right:5px;" id="signUpBtn">Submit</button>'
             +'<button style="padding:5px;margin-right:20px;" id="cancelBtn">Cancel</button>'
             +'</p>'
             +'</div>'



registerBox = $.modal(html, {
    closeHTML:"",
    containerCss:{
        backgroundColor:"#fff", 
        borderColor:"#fff", 
        minHeight: 250, 
        width: ($(window).width() > 320)? 320 : $(window).width() - 10,
        padding:0 
    },
    overlayClose:true,
    opacity:80,
    overlayCss: {
        backgroundColor:"#000"
    },
        onShow : function (dialog) {


            $("#signUpBtn",dialog.data).click(function(){

                      var email = $('#emailBox').val();
                      var passwordBox = $('#passwordBox').val();
                      var realNameBox = $('#realNameBox').val();

                          if(email != '' && passwordBox != '' && realNameBox != '' && validateEmail(email) && filterName(realNameBox)){



                              $.ajax({
                                  type  : 'get',
                                  async : false,
                                  url: baseUrl+'/Index/register',
                                  data:{
                                        email   : email,
                                        password: passwordBox,
                                        realname: realNameBox
                                  },
                                  error: function(req,error){ 
                                    console.log(req.statusText);
                                  },
                                  dataType: 'json',
                                  cache: false,
                                  success   : function(msg){  

                                    if(msg.status == "OK"){ 
                                        message = 'Successfully Registered.';
                                        alert(message);
                                        window.location.reload();
                                    }else{
                                        message = 'Registration failed, Email address already used.';
                                        $('#infoBox').html(message).css('color', 'red');
                                        return false;
                                    } 
                                }

                               });
                          }else{  
                              if(email == ''){$('#emailBox').addClass('border-red');}else{$('#emailBox').removeClass('border-red');}
                              if(passwordBox == ''){$('#passwordBox').addClass('border-red');}else{$('#passwordBox').removeClass('border-red');}
                              if(realNameBox == ''){$('#realNameBox').addClass('border-red');}else{$('#realNameBox').removeClass('border-red');}
                              $('#infoBox').html('Please complete or correct the fields above marked in red.');

                              if(validateEmail(email) == false){
                                  $('#emailBox').addClass('border-red'); 
                              }else{
                                  $('#emailBox').removeClass('border-red'); 
                              }

                              return false;
                          }


            });




            $('#realNameBox').keypress(function(e){
                 if (e.which == 13) {
                     $("#signUpBtn",dialog.data).click();

                 }  
            });

            $("#cancelBtn",dialog.data).click(function(){

                var email = $('#emailBox').val('');
                var passwordBox = $('#passwordBox').val('');

                $.modal.close();
            });
        },
        onOpen: function (dialog) {
            dialog.overlay.fadeIn('fast', function () {
                dialog.data.hide();
                dialog.container.fadeIn('fast', function () {
                    dialog.data.slideDown('fast');   
                });
            });
        },
        onClose: function (dialog) {
            dialog.data.fadeOut('fast', function () {
                dialog.overlay.slideUp('fast', function () {
                    $.modal.close();
                });
            });

        }
});
}

我尝试使用一些代码来限制文本框接受特殊字符，但似乎它不起作用。

Answer 1

借用Valentin Jacquemin上面的正则表达式并使用jQuery：

$(function(){
    $('input, textarea').keyup( function(){
        var inputs = $(this).val();
        $(this).val(inputs.replace(/[^a-z0-9\s]/gi, ''));   
    });
});

http://jsfiddle.net/r3wt/wBLxL/11/

替换所有非字母数字字符。

Answer 2

正则表达式可能是要走的路：

var isNameValid = /[!@#$%^&*()_+]/.test(realNameBox);

正如ljacqu在您的问题评论中所建议的那样，确保您也验证服务器端。

Answer 3

最好的方法是使用常规表达式：

 function isValid(str){
       return !/[!@#$%^&*()_+]/.test(str);
 }

如果表达式没有保留任何这些字符，函数将返回true。

正如评论中所建议的那样，确保在php中做同样的事情。您可以使用相同的原则并使用reg。 php中的表达式：

 function isValid($str) {
    if (preg_match("/[!@#$%^&*()_+]/", $str)) return false;
    return true;
}

NAME框中不允许使用特殊字符

3 个答案: