How can I list all available keyboard characters with JavaScript or|and PHP?
Lets say that user doesn't have access to the keyboard and can only fill a form with the mouse. I want to list all available keyboard characters to bind them to the mouse click event.
EDIT:
I don't care what kind of keyboard user has. What I know is that Alt + 0246 gets ö as #Barney sad. Where is that ö stored so that some keyboards access that character from a key and others with ALT + 0246? Isn't that location like an array accessible by PHP|JavaScript?
You may need to look into these
JS Based on-screen keyboard for browser, like on cellphones and tablets
http://jquerybyexample.blogspot.com/2012/04/jquery-ui-virtual-keyboard-plugin.html
Impossible to detect what keyboard the user has from within the browser context — this is the cause of a whole host of problems, as helpfully described here — which means we can't tell what characters are directly inputtable by the user.
As an example, German and Turkish users probably have ö readily available. I had to hold Alt and hit 0246 in sequence on my number pad to produce it. The end result is the same.
The other thing to bear in mind is that, even if you can determine exactly which key was hit, what it means and does is another thing entirely. The user could have rebound their commands at many junctures, or may be using a regional emulator.
Try something like this:
var container = $('#container');
for ( var i = 0; i < 26; i++ ) {
var chr = $('<div>' + String.fromCharCode(97 + i) + '</div>');
container.append(chr);
chr.click(function() {
console.log($(this).text());
});
}
Related
What I want to do is so that when word riches the end of the line to divide word into two words and insert hyphen before line-break. It's similar to <wbr> tag but it doesn't inserts anything.
Examples:
Java- <--- I want to insert this hyphen before line-break
Script
or
Ja- <---- Same here
vaScript
Is there anyway of doing it? I don't mind using php, javaScript but jQuery would preferable and if I can achieve it using CSS or HTML that would be great.
Thnx in advance!
If you want to do it client-side, you will need a hyphenation plugin. Reason being, there needs to be a dictionary of hyphenation rules to follow, and that's something that's not simply included in the browser. [update: although, that statement is partially false already! Chris's link shows limited (very limited, but still... promising!) support.]
Here's one jQuery plugin I found: http://archive.plugins.jquery.com/plugin-tags/hyphenation and I know I've used one in a project before (may have been this one even). It will of course insert the hyphen into the node's contents, but the content doesn't need to have it included, the hyphenation is calculated by the function after DOM ready.
Whether or not the rules are extensive enough to break up words outside of the 'norm' is another question.
Side note: JavaScript is a proper noun, which should be excluded from hyphenation. I imagine that was just an example off the top of your head, though. ;-)
It looks like there is some limited browser support for CSS hyphenation. Does that work for you?
This function should solve your problem. It insert Soft Hyphen | $shy; into "long" words.
pText = Your string
pMax = Every X Char in a word insert a Soft Hyphen;
function hyphen(pText, pMax){
var t = pText.split(" ");
for(i=0; i<t.length; i++){
if(t[i].length<pMax){
var w = t[i]
var re = new RegExp("(.{"+pMax+"})","g");
if(w.length<pMax+3){
var pos = t[i].length - 3;
re = new RegExp("(.{"+ pos +"})","g");
}
t[i] = w.replace(re,"$1"+);
}
}
return t.join(" ");
}
Ok guys, this question is related to my previous one.
If I have set $textlimit = 500; that will limit my text to 500 characters.
Is there any way to "avoid" text limit, and then onclick function load rest of it?
For example, if I set:
$textpart = substr($fulltext, 0, 400);
$textpart will only contain 400 characters of string.
My question is, how to declare variable, which will contain the rest of the text which is much longer than 500 characters?
Example of variables:
$fulltext //Contains full text, but is limited to 500 characters.
$textpart //Contains part of the text, substr 400 characters out of 500.
$textrest //This variable to "hold" rest of the text, after 400 characters of $textpart.
Like I've asked in previous question, I wanted to make expand and collapse button, I now know how to do that, but I don't know how to divide text.
Form would go like this:
Random text here(400 characters long)
Random image for expand
After declared onclick function I, load rest of the text (Over 500 characters).
Random image for collapse
After declared onclick function collapse and return to previous state - citation 1.
I hope I explained my question the right way. I would really appreciate any kind of help, if I can choose, I would like just basic explanation on how to that, because I want to learn that, not copy/paste solution (it is easier, but I will not learn much).
Thanks in advance.
$textrest = substr($fulltext, 400)
$fulltext = substr($fulltext, 0, 500);
$textpart = substr($fulltext, 0, 400);
$textrest = substr($fulltext,400,strlen ( $fulltext ));
If I understand you correctly you want to show the user an initial page that shows only the first X characters and then show all the characters when the users clicks on the text.
There are three strategies to do this. From easy to hard:
Output the shortened text and include a link that will reload the whole page but with the whole text
Output all the text and use css and JavaScript to hide/show any overflow
Output the shortened text and perform an Ajax call to load the extra characters and append
Options 2 and 3 require the use of client side JavaScript and are therefore not pure PHP solutions.
Option 1 is a matter of adding a $_GET variable, e.g. ?expand=para1, to your url and expanding the text identified in PHP by $_GET['expand'].
Do not make the mistake of thinking PHP is still running on the page in the browser. Only JavaScript can run in the browser on the web page. (Not strictly true I know, but true enough in reality.)
*UPDATE:*I've already answered my question. But you can still give me advise and i'll take your answer as selected
NOTE: If you don't need to know what I want to do with the codes, just skip the first several paragraphs and directly see the codes and tell me why they doesn't work without error.
I want to make something like stackoverflow's similar title search when you enter your title in the ask page.
I need to split words to make regex and then search in the database. Since my application is in Chinese(no spaces between each words) and I think splitting chinese into meaningful phrases using PHP is too hard. I have an idea splitting it in the client side using javascript according to chinese IME's characteristic that, for example, if you want to type the word "你好中国" in chinese, people usually type "nihao[space]zhongguo" in IME(note where the space bar is), since '你好'(nihao - hello) is a phrase and '中国'(zhongguo - china) is another. So when people press space bar i record the word he entered before the space and start a timer of 2 seconds , if he or she enters another words clear the timer and continue to record if he or she doesn't, send each words recorded to the server.
Qustion is, is this a good idea? Are there any other convenient way to do this? And why these lines i wrote to test won't work without error.
script:
$(function(){
var i=0;
$('#t').keyup(function(e){
if(e.keyCode==32)
{
eval("a"+i+"=$(this).val()");
i++;
var timer=setTimeout("for(b=0;b<i;b++){alert(eval('a'+b));}",1000);
if($("#t").keydown())
{
clearTimeout(timer);
}
}
})
})
html:
<input id="t"/>
I think i know why it won't work now:
First, i should be a global variable;
Second, the keydown() function should be outside of the keyup(). modified js:
$(function(){
i=0;
timer=null;
$('#t').keyup(function(e){
if(e.keyCode==32)
{
eval("a"+i+"=$(this).val()");
i++;
timer=setTimeout("for(b=0;b<i;b++){alert(eval('a'+b));}",1000)
}
})
if($("#t").keydown())
{
clearTimeout(timer);
}
})
If you have other suggestions on my idea or codes you can still answer this question or i'll select this one after some time.
hey, I trying to enter the text in lowercase letter but when it comes to textbox it must be in uppercase if anyone can do this.
You can do this with CSS, no need for JavaScript or PHP
text-transform:uppercase
text-transform:lowercase
Add these to the style of each element class.
Or if you are resorting to inline styling, do this.
<input type="text" style="text-transform:uppercase;" />
String to uppercase with PHP (php.net doc):
strtoupper("Hello")
Output: HELLO
String to uppercase with JavaScript (java2s.com):
var s = new String("Hello")
s.toUpperCase()
Output: HELLO
Your options are:
As Raoul said, use CSS. If you possibly can, this is your best bet.
Let the user type in lower case, then transform it when they leave the field (blur, etc.) or when you save/process the text (e.g., on the server, whatever). Here's a blur example:
document.getElementById('theIDOfTheTextArea').onblur = function() {
this.value = this.value.toUpperCase();
};
Live example
Do it with JavaScript in the keydown or keypress event. Despite the various attempts intermittently posted here, doing this with JavaScript not trivial. It's trivial to identify the keypresses you want to handle and to cancel the event to prevent that keypress being added; but then inserting the character you do want is non-trivial. (Sadly, the keyboard events don't just let you substitute a different character; that would be nice, but they don't.) It unfortunately requires that you use text ranges / selections and gets you into areas that vary cross-browser. You'd probably need to leverage a library like Rangy to do it. I'd Just Say No and go the CSS / post-processing route.
The answer to this post will solve your problem.
Get the textbox element by id
Set an onBlur listener and convert its value using string.toUpperCase()
Have you check this
Upper
$("#idoftextbox").blur(function(){$(this).val($(this).val().toUpperCase())});
Put this in an onload event
Easy:
textareaElement.onkeydown = function(e) {
//make sure IE gets it
e = e || event;
//don't insert
e.preventDefault();
//catch the ASCII key code, and convert it to uppercase letter
this.value += String.fromCharCode(e.keyCode).toUpperCase();
}
I want a phone number which display on public page will be protected. Example converts phone number characters to HTML entities and bots can't grab the number in plain text. Let me know the trick.
This is a...passing thought, though I'm not sure how practical it would be:
<span class="protectedNumber" title="01234567890"></span>
css:
span.protectedNumber:before {
content: "Phone number: " attr(title);
}
JS Fiddle demo.
Edited, in response to 'cross browser?' question in comments, to add a jQuery option to assist with those browsers that don't have the ability to deal with css-generated content:
$(document).ready(
function(){
$('.protectedNumber').each(
function(){
$(this).text('Phone number: ' + $(this).attr('title'));
});
});
some ideas
display the phone number as an image
use javascript to create and display the phone number
throw in html tags in between the numbers (e.g. [span]) that visually makes no difference but makes it more difficult for the bot to recognize the phone number
Try writing the number using ASCII:
http://www.ascii.cl/htmlcodes.htm
<html>
<body>112</body>
</html>
The first thing I'd think of is render an image.
Use Javascript to obfuscate
Obfuscate using a php function
Sure just print the phone number using words instead of numbers...
Create an image of the number, this will foil MOST bots, but some may have OCR, so obfuscate it.
ie: Good:
Better:
The 2nd 1 better because like Captcha, the background contains "noise" that makes it hard for OCR enabled bots to harvest, but is as readable to human eyes..
The hard solution would be use Captcha or a simple PHP script to create the picture on the fly, but in most cases, unless you using alot of different #'s the "better" solution above easiest and quickest method, can do easy even in simple program like Paint in 5 min.
For the visually impaired, include a small link to an audio file (mp3) of you saying the number, if it linked properly, and accordingly, it should work.