I'm trying to implement a JavaScript code that :
1- takes a character entered by a user in an HTML form input text
2- get the character keyCode
3- Display a different character in Arabic corresponding to the previous KeyCode
For example, if the user press "A" button, I will display "ض" in the input text field.
I've tried this code but it's not working :
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction(e)
{
var keyCode = (window.event) ? e.which : e.keyCode;
if (keyCode == 65)
document.getElementById("firstname").innerHTML="ض";
}
</script>
</head>
<body>
<FORM action="http://somesite.com/prog/adduser" method="post">
<P>
<LABEL for="firstname">First name: </LABEL>
<INPUT type="text" id="firstname" onkeydown="myFunction()"><BR>
</P>
</FORM>
</body>
</html>
The block of code is tried for just one character, if this is working I will be able to implement the algorithm for the rest of characters.
any help on this topic would be greatly appreciated !
You've got a few issues:
onkeydown attribute to myFunction(), the function is being called without any arguments. It's more convenient to do the event binding in the script anyway (that way you don't have to do script debugging in your HTML), but this also allows you to specify the e parameter for the event argument.innerHTML, but it should be value — <input>s don't have innerHTML, as they're self-closing.return false top stop the a being added to the value after ضwindow.onload = function(){
document.getElementById("firstname").onkeydown = function myFunction(e){
var keyCode = window.event ? window.event.keyCode : e.which;
if (keyCode == 65){
this.value += "ض";
return false;
}
}
}