javascript - Removing unwanted characters from textbox with JQuery - Stack Overflow

admin管理员组

文章数量:1344932

What I would like to get some input on is how to remove certain characters from a textbox (or textarea) with JQuery. I have the code in C# but I can´t seem to translate that to JQuery javascript. My problem is that I don´t know how to get the value from a textbox as a character array which I then can loop through and pare against a given set of unwanted characters. This is how "far" I have e in JQuery:

$("input[type=text], textarea").change(function() {

   // code here

});

This is my code in C#:

for (int i = 0; i < charArray.Length; i++)
{
    current = charArray[i];
    if ((current == 0x9) ||

        (current == 0xA) ||

        (current == 0xD) ||

        ((current >= 0x20) && (current <= 0xD7FF)) ||

        ((current >= 0xE000) && (current <= 0xFFFD)))
        _validXML.Append(current);
}

return _validXML.ToString().TrimEnd((char)32, (char)160) ;

UPDATE:

I went with a bination of some answers below (I will upvote them) and my final JQuery looks like this and works:

$(document).ready(function() {
    $(":text, textarea").change(function() {
        var text = "";
        var arr = $(this).val()
        $.each(arr, function(i) {
            var c = arr.charCodeAt(i);
            if ((c == 0x9) ||
                (c == 0xA) ||
                (c == 0xD) ||
                (c >= 0x20 && c <= 0xD7FF) ||
                (c >= 0xE000 && c <= 0xFFFD)) 
            {
                text += arr.charAt(i);
            }
        });
        $(this).val(text);
    });
});

Thanks all!

What I would like to get some input on is how to remove certain characters from a textbox (or textarea) with JQuery. I have the code in C# but I can´t seem to translate that to JQuery javascript. My problem is that I don´t know how to get the value from a textbox as a character array which I then can loop through and pare against a given set of unwanted characters. This is how "far" I have e in JQuery:

$("input[type=text], textarea").change(function() {

   // code here

});

This is my code in C#:

for (int i = 0; i < charArray.Length; i++)
{
    current = charArray[i];
    if ((current == 0x9) ||

        (current == 0xA) ||

        (current == 0xD) ||

        ((current >= 0x20) && (current <= 0xD7FF)) ||

        ((current >= 0xE000) && (current <= 0xFFFD)))
        _validXML.Append(current);
}

return _validXML.ToString().TrimEnd((char)32, (char)160) ;

UPDATE:

I went with a bination of some answers below (I will upvote them) and my final JQuery looks like this and works:

$(document).ready(function() {
    $(":text, textarea").change(function() {
        var text = "";
        var arr = $(this).val()
        $.each(arr, function(i) {
            var c = arr.charCodeAt(i);
            if ((c == 0x9) ||
                (c == 0xA) ||
                (c == 0xD) ||
                (c >= 0x20 && c <= 0xD7FF) ||
                (c >= 0xE000 && c <= 0xFFFD)) 
            {
                text += arr.charAt(i);
            }
        });
        $(this).val(text);
    });
});

Thanks all!

• javascript
• jquery

Share Improve this question Follow edited Jun 26, 2009 at 10:36 Johan Leino asked Jun 25, 2009 at 15:00 Johan LeinoJohan Leino 3,53311 gold badge2828 silver badges2929 bronze badges 2

• validating xml based on that? I can only assume this isn't expected to be utf-8 (which can have up to 6 bytes per character) – Jonathan Fingland Commented Jun 25, 2009 at 15:07
• validating xml...?? I guess you are referring to my c# variable _validXml...which really has nothing to do with what I´m trying to do on the client. – Johan Leino Commented Jun 25, 2009 at 15:44

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 6

Would't this be the case for regular expressions, like:

$("input[@type='text'], textarea").change(function() {
    this.value = this.value.replace(/[^\w\d]+/gim,"");
});

Textarea:

<textarea id="item" name="item" rows="5" cols="80">Some text in here</textarea>

jQuery code:

var text = $('#item').val();
var newtext = "";
for (var i = 0; i < text.length; i++) {
   var c = text.charCodeAt(i);
   if ((c == 0x9) || (c == 0xA) || (c == 0xD) || 
       (c >= 0x20 && c <= 0xD7FF) ||
       (c >= 0xE000 && c <= 0xFFFD)) {
       newtext += text[i];
   }
}
$('#item').val(newtext);

This has actually very little to do with jQuery, methinks, except to access the text data and set it again.

You can use the charCodeAt() method bined with the length property of strings to loop through the characters in the string.

Something like:

$("input[type=text], textarea").change(function() {
  var text = $(this).val()

  for(var i = 0; i < text.length; ++i) {
    var currentChar = text.charCodeAt(i);

    // Do something with it...
});

My initial version used charAt(), but since it looks like you're dealing with Unicode code points, charCodeAt() is more appropriate.

Use an event observer (onkeydown / onkeypress / onkeyup) on the input/textarea, get the key pressed, if the key is an unwanted character, stop the event from happening.

$("input[type=text], textarea").observe('keypress', function(e) {
 var keynum; 
 if(window.event)
 {
  keynum = e.keyCode
 }
 else if(e.which)
 {
  keynum = e.which
 }
 if(keynum == '13' || keynum == 'something else' || [...])
 {
  Event.stop(e);
 }
});

to get the value of textarea try:

$('input[type=textarea]').change(function(){
   var value = $(this).val(); 
   ...........
});

to remove unwanted character try this example .. i copy from the jquery documentation (jQuery.grep())

var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];
$("div").text(arr.join(", "));

arr = jQuery.grep(arr, function(n, i){
  return (n != 5 && i > 4);
});
$("p").text(arr.join(", "));

arr = jQuery.grep(arr, function (a) { return a != 9; });
$("span").text(arr.join(", "));

I prefer to stop the character from getting entered in the first place, using this type of javascript function (from my shady past):

each input control has something like this on it: onkeypress='checkKey(this,"a-zA-Z0-9","N","10");'

the function looks like:

   //****************************************************************************
   // Function: checkKey()
   //   Author: Ron Savage
   //     Date: 10-11-2004 
   //    
   // Description: This function tests reg exp syntax.
   //****************************************************************************
   function checkKey(textControl, reExpr, allCaps, maxlen)
    {
      popupMessage.hide();

      keyStr = String.fromCharCode(event.keyCode);
      textLength = textControl.value.length;

      if (allCaps == 'Y')
         {
         keyStr = keyStr.toUpperCase();
         event.keyCode = keyStr.charCodeAt(0);
         }

      if ( reExpr != '' )
         {
        reString = '[^' + reExpr + ']';
         re = new RegExp(reString, 'g');

         //alert('RE: ' + reString);

         result = keyStr.match(re);

         if (result)
            {
            beep();
            event.returnValue = false;
            showPopupMessage(textControl, result.toString() + ' not allowed!');
            }
         }

      if ( textLength > maxlen )
         {
            beep();
            event.returnValue = false;
            showPopupMessage(textControl, 'Max length [' + maxlen + '] exceeded!');
         }

      //alert('Key: ' + keyStr + ' code: ' + event.keyCode);
      }

本文标签： javascriptRemoving unwanted characters from textbox with JQueryStack Overflow