Mootools 1.2 Tutorial Input Filter Part II (String) _mootools

Source: Internet
Author: User
Tags mootools
We will use the basic knowledge of regular expressions and the use of mootools in the future with another lecture.
Before I start, I'd like to take a moment to see how string functions are invoked. In my example, I call this method directly above the string variable, as follows:
Reference code:
Copy Code code as follows:

var my_text_variable = "Heres some text";
Result string Variable method name
var result_of_function = my_text_variable.somestringfunction ();

But I write this just to be able to explain it more clearly, you should realize that these string functions can also be invoked directly on a string without having to declare a variable, like this:
Reference code:
Copy Code code as follows:

var result_of_function = "Heres some text". Somestringfunction ();

Note that the digital processing function in the MooTools is also valid:
Reference code:
Copy Code code as follows:

Notice the usage, which is the number in parentheses.
Instead of strings that are enclosed in single quotes
var limited_number = (256). Limit (1, 100);

And, again, I want to stress again: using JavaScript to filter input does not filter the data before it is sent to the server. Everything you write in JavaScript can be seen, manipulated, and banned by your web surfers. We will talk about MooTools's request class in the future, the PHP filter technology to do some simple discussion. At the same time, continue to maintain any security-related things that you originally want to do on the server side, and do not rely on JavaScript.
Trim ()
The TRIM function provides a simple and straightforward way to remove any whitespace characters at the ends of the string you want to process.
Reference code:
Copy Code code as follows:

This is the string we want to trim.
var Text_to_trim = "\nstring with whitespace";
The trim string is "string with whitespace"
var trimmed_text = Text_to_trim.trim ();

If you haven't seen it before, it's just a line break. You can use it in a string to split the string into multiple lines. The Trim method also treats the newline character as a blank character, so it also removes the line break. The only special thing that the trim method does not do is that it does not remove any extra whitespace characters from a string. The following example shows how trim handles line breaks in a string:
Reference code:
Copy Code code as follows:

var Trimdemo = function () {
Set the string we want to trim
var Text_to_trim = ' \ntoo much whitespace\n ';
Trim it
var trimmed_text = Text_to_trim.trim ();
Show results
Alert (' before trimming: \ n ' +
' | | ' + text_to_trim + '-|\n\n ' +
' After trimming: \ n ' +
' | | ' + trimmed_text + '-| ');
}


Clean ()
To be more meaningful, you may not need to remove all whitespace from a string. Fortunately, for those blank characters you feel strong, MooTools generously provides you with the clean () method.
Reference code:
Copy Code code as follows:

This is the string we want to trim.
var Text_to_clean = "\nstring \nwith Lots \ n more \nwhitespace \ n";
The string after clean is "string with Lots more whitespace"
var cleaned_text = Text_to_trim.clean ();

The clean () method is a little different from the trim () method. It extracts all the blanks in the characters you pass in, not just the blank characters in the head and tail. They mean any more than one white space character in the string and any newline characters and tabs (tab). Comparing the results of the pruning, we'll see what it means:
Reference code:
Copy Code code as follows:

var Cleandemo = function () {
Set the string we want to trim
var Text_to_clean = ' too\n much\n whitespace ';
Clean the string
var cleaned_text = Text_to_clean.clean ();
Show results
Alert (' before cleaning: \ n ' +
' | | ' + text_to_clean + '-|\n\n ' +
' After cleaning: \ n ' +
' | | ' + cleaned_text + '-| ');
}


Contains ()
Similar to the trim () and clean () methods, The contains () method does a very simple thing, without any other showy. It checks a string to see if it contains a string you are looking for, returns true if it finds the string to find, and returns False if it is not found.
Reference code:
Copy Code code as follows:

We're going to look inside this string.
var String_to_match = "Does this contain thing work?";
Find ' contain ', did_string match is True
var did_string_match = string_to_match.contains (' contain ');
Find ' propane ', did_string_match to False
Did_string_match = string_to_match.contains (' propane ');

This approach can be useful in a variety of situations, and when you and other tools, such as the Array.each () function We talked about in the third lecture, you can use a relatively small amount of code to accomplish some slightly more complex tasks. For example, if we put a series of words into an array and then iterate one by one, we can look for multiple words in the same area of a text with less code:
Reference code:
Copy Code code as follows:

String_to_match = "String containing whatever words you want to try to match";
Word_array = [' words ', ' to ', ' match '];
Pass each word in the array as a variable
Word_array.each (function (word_to_match) {
Find the current word
if (String_to_match.contains (Word_to_match)) {
Alert (' found ' + word_to_match);
};
});

We put it in a textbox, add a little imagination, you can have your own dirty word (or any other) detector.
Reference code:
Copy Code code as follows:

var Containsdemo = function () {
Put the words we want to forbid into an array
var banned_words = [' Drat ', ' goshdarn ', ' fiddlesticks ', ' kumquat '];
Get content in a text field
var textarea_input = $ (' textarea_1 '). Get (' value ');
Enumerate every word in a filtered word
Banned_words.each (function (Banned_word) {
Find the current filter word in the Text field content
if (Textarea_input.contains (Banned_word)) {
Tell the user that the word cannot be used
Alert (Banned_word + ' is not allowed ');
};
});
}


Substitute ()
Substitute () is a very powerful tool. We're just going to talk a little bit about it today, and substitute's more powerful features come from the use of its regular expressions, which we'll talk about a bit later. However, you can do a lot of things just by using these basic features.
Reference code:
Copy Code code as follows:

This is the text template to use the Substitute method
Note that the parts to be replaced are the ones enclosed in curly braces
var Text_for_substitute = ' One is {one} ', two {two}, Three is {Three}. '
This object contains the rules to be replaced
The part that is not enclosed in quotes is the search term
The part enclosed in quotation marks is the sentence used to replace the search term.
var substitution_object = {
One: ' The variable ',
Two: ' Always comes second ',
Three: ' Getting sick of bronze. '
};
Substitute method for Text_for_substitute on the rise
Pass the Substitution_object as a parameter
Assign the substitution result to the variable new_string
var new_string = Text_for_substitute.substitute (Substitution_object);
New_string now has the value "one is", two always comes second, Three is getting sick of bronze of ... "

In fact, you don't need to create a Substitution_object object to use the substitute method, and if you think it's inappropriate, the following method can also be implemented:
Reference code:
Copy Code code as follows:

Create a string to replace
var Text_for_substitute = "{Substitute_key} and the original text";
Pass the object to be replaced as a parameter to the substitute method
var Result_text = Text_for_substitute.substitute ({substitute_key: ' Substitute_value '});
Result_text is now "Substitute_value and the original text."

You can do it a little bit more in this way, and you can use a function call that gets a value from a DOM object as the value of the replacement item, which is also possible.
Reference code:
Copy Code code as follows:

var Substitutedemo = function () {
Get the original text from the TextField
var Original_text = $ (' Substitute_span '). Get (' HTML ');
Replace the value in TextField with the value in the text box
var new_text = Original_text.substitute ({
A: $ (' First_value '). Get (' value '),
Second: $ (' Second_value '). Get (' value '),
Third: $ (' Third_value '). Get (' value '),
});
Replace content in span with new text
$ (' Substitute_span '). Set (' HTML ', new_text);
Disable Substitute button
and enable the reset button
$ (' Simple_substitute '). Set (' disabled ', true);
$ (' Simple_sub_reset '). Set (' disabled ', false);
}
var substitutereset = function () {
Create a variable to hold the original text
var original_text = "| | {Second}--{third}-|";
Replace the content in span with the original text
$ (' Substitute_span '). Set (' HTML ', original_text);
Disable reset button
and enable substitute
$ (' Simple_sub_reset '). Set (' disabled ', true);
$ (' Simple_substitute '). Set (' disabled ', false);
}

| |-{SECOND}--{third}-|
First_value
Second_value
Third_value
Before the end of the day, there is a small hint that if you invoke the substitute method on a string and do not provide a key/value pair (Key/value pair) object for the keyword to be replaced, it will simply remove the contents from the curly braces. So, if you need to keep the strings inside the curly braces, be careful not to use this method. For example, as follows:
Reference code:
Copy Code code as follows:

("{One} some stuff {two} some more stuff"). Substitute ({one: ' substitution text '});

This will return "substitution text some stuff some more stuff".

Learn More

Download a Zip package that contains the one you need to start

    • weird Mode on string (this guy is amazing)
    • JavaScript string Function Reference
    • MooTools String Document

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.