问题
I am developing a website using HTML5
and AngularJS
. I want to develop a site in Hindi language. One requirement is that the site should allow to enter text in the Devanagari alphabet even in devices that do not have the appropriate keyboard.
Time ago I hot-linked a Microsoft bookmarklet that's no longer available (http://ilit.microsoft.com/Bookmarklet/Script/Hindi.js
) which would convert from English to Hindi: you type "kya" and then get the corresponding Hindi characters.
Can you suggest tools to do the same, using this or other system?
回答1:
Download code from http://www.gamabhana.com/?q=node/3
Extract downloaded folder. Now your folder have the following content
gamabhana_js have all js files that you need. Open the index.html in browser and enter something in textarea. Then you can see corresponding Hindi fonts instead of English. You can edit that index file and use according to your need.
Following is a sample code that I edited If I click on hindi then I will get Hindi fonts instead of English
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script language="JavaScript" type="text/javascript" src="./gamabhana_js/GA1000.js"></script>
<script language="JavaScript" type="text/javascript" src="./gamabhana_js/GA0010.js"></script>
<script language="JavaScript" type="text/javascript" src="./gamabhana_js/GA0640.js"></script>
<script language="JavaScript" type="text/javascript" src="./gamabhana_js/gamabhanaLib.js"></script>
<script language="JavaScript" type="text/javascript" src="./gamabhana_js/fileio.js"></script>
<script language="JavaScript" type="text/javascript" >
gw1=null;
var hindi=false;
function myCustomOnInit()
{ try{
if(hindi==true){
gw1= new gamabhanaPhoneticHandler("elm1_ifr",'__devanagari__','__roman__','#gamabhana#');
gw1.MrAutoCor=true;
GphRegisterForMasterUpdates(gw1);
}
}
catch(e){}
}
function LanguageList_onchange() {
gw1.SetPriLanguage(document.getElementById('LanguageList1').value);
}
function arrangekbhelp()
{
document.getElementById('kbhelpdiv').style.left=(window.document.body.clientWidth-400) + "px";
if((window.document.body.clientWidth-400)<0)
document.getElementById('kbhelpdiv').style.left=0 + "px";
}
function hindi1(){
hindi=true;
myCustomOnInit();
}
function togglekbhelp()
{
arrangekbhelp();
if(document.getElementById('kbhelpdiv').style.display=='block')
document.getElementById('kbhelpdiv').style.display='none';
else
document.getElementById('kbhelpdiv').style.display='block';
return;
}
window.onresize=arrangekbhelp;
</script>
<!-- TinyMCE -->
<script type="text/javascript" src="jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
// General options
mode : "textareas",
theme : "advanced",
plugins : "safari,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,noneditable,visualchars,nonbreaking,xhtmlxtras,template",
// Theme options
theme_advanced_buttons1 : "newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect,langselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl",
theme_advanced_buttons4 : "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
// Example content CSS (should be your site CSS)
content_css : "css/content.css",
oninit : "myCustomOnInit",
// Drop lists for link/image/media/template dialogs
template_external_list_url : "lists/template_list.js",
external_link_list_url : "lists/link_list.js",
external_image_list_url : "lists/image_list.js",
media_external_list_url : "lists/media_list.js",
// Replace values for the template plugin
template_replace_values : {
username : "omkar",
staffid : "9383"
}
});
</script>
<!-- /TinyMCE -->
</head>
<body>
<form>
<textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 80%"> </textarea>
</form>
<button onclick="hindi1()">Hindi</button>
</body>
</html>
来源:https://stackoverflow.com/questions/21378693/javascript-library-to-type-hindi-with-international-keyboards