最近需要將一個項目部署到觸控一體機，客戶要求所有網(wǎng)頁文本框輸入必須支持手寫輸入，之前一直沒有實現(xiàn)過這樣的功能，于是讓組員上網(wǎng)搜索了一下，結(jié)果發(fā)現(xiàn)百度輸入法提供網(wǎng)頁文本框手寫輸入的js調(diào)用api，是利用flash調(diào)用漢王字庫來實現(xiàn)的。下面是詳細的代碼。
<!doctype html><html><head><meta http-equiv=”Content-Type” content=”text/html;charset=gb2312″><title>網(wǎng)頁文本框手寫輸入</title& gt;<style>#sx{color:#00C;text- decoration:underline;cursor:pointer;}</style>< /head><body>單擊“手寫”可以在手寫區(qū)輸入，然后點擊備選區(qū)的相應(yīng)文字，完成輸入！<br><form name=”f” action=”http://www.okajax.com”><input type=”text” name=”wd” id=”kw” maxlength=”100″><input type=”submit” value=”提交” id=”su”><span id=”sx”>手寫</span></form><script> var w = window,d = document,n = navigator,k = d.f.wdif (w.attachEvent) {w.attachEvent(“onload”, function() {k.focus();})} else {w.addEventListener(‘load’, function() {k.focus()},true)};var hw = {};hw.i = d.getElementById(“sx”);var il = false;if (/msie (\d+\.\d)/i.test(n.userAgent)) {hw.i.setAttribute(“unselectable”, “on”)} else {var sL = k.value.length;k.selectionStart = sL;k.selectionEnd = sL}hw.i.onclick = function(B) {var B = B || w.event;B.stopPropagation ? B.stopPropagation() : (B.cancelBubble = true);if (d.selection && d.activeElement.id && d.activeElement.id == “kw”) {hw.hasF = 1} else {if (!d.selection) {hw.hasF = 1}}if (!il) {var A = d.createElement(“script”);A.setAttribute(“src”, “http://www.baidu.com/hw/hwInput.js”); d.getElementsByTagName(“head”)[0].appendChild(A);il = true;}}; </script>實用為王，手寫輸入法讓上網(wǎng)更加簡單
</body></html>
如果你直接復制以上代碼并保存為html在本地測試的時候，你可能會發(fā)覺，手寫功能失效，只是可以手寫，但無法選擇文字，而其他功能也無法操作。又或者你會得到如下圖的Adobe Flash Player安全性警示框。
網(wǎng)頁文本框手寫輸入
如何解決這個問題？你可以在windows XP的C:\Documents and Settings\用戶名\Application Data\Macromedia\Flash Player\#Security\FlashPlayerTrust目錄路徑(注：如果不存在FlashPlayerTrust文件夾就創(chuàng)建一個，此 外，如果找不到Application Data目錄的話，可以在文件夾－》查看里選擇顯示所有文件和文件夾)里增加一個信任配置文件。新建一記事本，打開并寫上你的html文件所在的目錄， 如： F:， 然后保存為shouxieshuru.cfg。再打開html時，手寫輸入功能完全起作用了。
參考資料：http://www.okajax.com/a/201009/shouxieshuru.html
http://www.code-design.cn/article/20090621/136.aspx
來自：
http://www.laokboke.net/2011/08/10/wenbenkuang-shouxieshuru/?utm_source=rss