如何把手写输入代码融入到网页的文本框中？？大家看下啊

Question

手写输入在一些二三线城市还是有一点实用的。在网上找了个手写的代码。可以用。图如下：
代码如下：  <form id="Searchword" name="f" action="http://www.baidu.com/s">
      <INPUT id="kw" class="st" type="text" name="Word" baiduSug="1"/>
      <INPUT id="su" class="sb" type="submit" value="百度搜索"  />
      <span style="cursor:pointer" id="sx" class="sx">手写</span>
  </form>
  
  
<script charset="gbk" src="javascript/opensug.js"></script>
<script>var w=window,d=document,n=navigator,k=d.f.q;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=="Word"){hw.hasF=1}else{if(!d.selection){hw.hasF=1}}if(!il){var A=d.createElement("script");A.setAttribute("src","javascript/hwInput.js");d.getElementsByTagName("head")[0].appendChild(A);il=true}}
</script>
以上是手写代码，我想把这个手写代码  放进我原来的网页中的 文本框，网页是发帖用的，有<INPUT name=...>和 <textarea name=.. > 我想在原网页的发帖的文本框旁边加个 “手写” 文字，用键盘 和手写输入都可以输入进去代码：<FORM id=myForm name=myForm method=post action=x.asp? onSubmit="return myForm_onsubmit()"><TD>标题：</TD>
<INPUT name="Title" size="60" maxLength="32" style="height:21px;line-height:20px;"><TD>内容：</TD>
<TEXTAREA name="Content" rows="12" cols="85" id="Content" onfocus="showVcode()"></TEXTAREA>
我试着把 手写代码 照搬过来，但出现错误，不能弹出手写框，可能得修改下其中些东西。希望各路高手帮忙看下，不胜感激

Answer 1

照搬过来后显示网页有错误，手写框不弹出。网页错误详细信息：用户代理: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727)
时间戳: Sun, 21 Oct 2012 15:46:35 UTC
消息: 'd.f.q' 为空或不是对象
行: 1529
字符: 37
代码: 0
URI: http://www.XXX.com/fabu.asp

Answer 2

要移植的话也应一并修改hwInput.js:
hw.g = function(A) {
  return document.getElementById(A)
};
hw.input = document.f.kw;
kw要改成你自己的控件

Answer 3

手写要被声控替换了，在ＰＣ上应用似乎是没什么前途了啊
不过还是支持下吧
具体那里出问题了，水平有限，不好看出来，但有一些原则你可以自己查下啊，你首先要能得到手写的内容，然后，再把这些内容插入到要输入的控件中。
从你的错误信息中可以看出来：
消息: 'd.f.q' 为空或不是对象
d.f.q这个对象不存在啊，当然就出错了呢

Answer 4

恕在下小白啊，完全看不懂JS，能帮忙全修改下吗？ 万分感谢啊
hw.g=function(A){return document.getElementById(A)};hw.input=document.f.kw;hw.isIE=function(){if(navigator.userAgent.indexOf("MSIE")>-1){return true}else{return false}};hw.submitBut=hw.g("su");hw.flashIsLoaded=false;hw.sxBegin;hw.addEvent=function(B,A,C){B.attachEvent?B.attachEvent("on"+A,C):B.addEventListener(A,C,false)};hw.stopE=function(A){A=A||window.event;A.stopPropagation?A.stopPropagation():(A.cancelBubble=true)};hw.count=function(B){var A=window["BD_PS_C"+(new Date()).getTime()]=new Image();A.src="http://nsclick.baidu.com/v.gif?pid=201&pj=shouxie&type="+B+(arguments[1]?"&costTime="+arguments[1]:"")+"&t="+new Date().getTime()};hw.getOffSet=function(C){var B=0;var A=0;while(C.offsetParent){B+=C.offsetLeft;A+=C.offsetTop;C=C.offsetParent}if(hw.g("fm")&&hw.g("fm").currentStyle&&!/msie 8.0/i.test(navigator.userAgent)){B=B-parseInt(hw.g("fm").currentStyle.paddingLeft)}return{l:B,t:A+32}};hw.offset=hw.getOffSet(hw.submitBut);hw.hidden=function(A){A.style.left=-1000+"px";A.style.top=-1000+"px"};hw.show=function(A){A.style.left=hw.offset.l+"px";A.style.top=hw.offset.t+"px"};hw.addStyle=function(B){if(hw.isIE()){var C=document.createStyleSheet();C.cssText=B}else{var A=document.createElement("style");A.type="text/css";A.appendChild(document.createTextNode(B));document.getElementsByTagName("HEAD")[0].appendChild(A)}};hw.init=function(){var B=[];B.push("#hwr_div,#loading{font-size:12px;text-align:center;left:"+hw.offset.l+"px;top:"+(hw.offset.t)+"px;position:absolute;}");B.push("#hwr_div.hd,#loading.hd{left:-1000px;top:-1000px;width:1px;height:1px;}");B.push("#loading{width:304px; height:239px; border:1px solid #acb5d6;color:#333;}");B.push("#loading p{background:#f4f5fa; height:18px; position:relative;padding: 7px 0 0 7px;text-align:left;border-bottom:1px solid #acb5d6;color:#000;margin:0 0 90px 0;}");B.push("#loading p img{ position:absolute;right:0; top:0; cursor:pointer;}");hw.addStyle(B.join(""));var D=document.createDocumentFragment();var C=document.createElement("div");C.setAttribute("id","hwr_div");var A=document.createElement("div");A.setAttribute("id","loading");A.innerHTML='<p>手写输入<img id="loadingClose" onclick=\'hw.hidden(hw.loadingDiv);hw.hidden(hw.hwDiv)\' src="http://www.baidu.com/hw/sx_close.gif"/></p><div>手写输入法载入中....';D.appendChild(C);D.appendChild(A);document.body.appendChild(D);hw.hidden(C);hw.hidden(A)};hw.init();hw.loadingDiv=hw.g("loading");hw.hwDiv=hw.g("hwr_div");hw.loadingClose=hw.g("loadingClose");hw.hasFlash=(function(){var F=navigator;if(F.plugins&&F.mimeTypes.length){var C=F.plugins["Shockwave Flash"];if(C&&C.description){return C.description.replace(/([a-zA-Z]|\s)+/,"").replace(/(\s)+r/,".")+".0"}}else{if(window.ActiveXObject&&!window.opera){for(var B=10;B>=2;B--){try{var E=new ActiveXObject("ShockwaveFlash.ShockwaveFlash."+B);if(E){var A=E.GetVariable("\x24version");return A.replace(/WIN/g,"").replace(/,/g,".")}}catch(D){}}}}})();(function(){if(typeof (hw.hasFlash)=="undefined"){var A=hw.loadingDiv.getElementsByTagName("div")[0];A.innerHTML="对不起，请您先安装flash播放器"}})();hw.load=function(){hw.sxBegin=new Date();hw.show(hw.loadingDiv);hw.show(hw.hwDiv);if(hw.isIE()){hw.hwDiv.innerHTML='<object width="304" height="239" align="middle" id="hwflash" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"><param name="wmode" value="Opaque"><param value="always" name="allowscriptaccess"><param value="http://www.baidu.com/hw/main.swf" name="movie"></object>'}else{var A=/Chrome/i.test(navigator.userAgent)?' wmode="window" ':' wmode="Opaque" ';hw.hwDiv.innerHTML='<embed width="304" height="239" align="middle" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="hwflash" src="http://www.baidu.com/hw/main.swf" '+A+' allowscriptaccess="always" ver="9.0.0">'}};hw.getMovie=function(A){return document[A]||window[A]};hw.isCompleteChar=false;hw.isDisplay=false;hw.ready=function(){var A=new Date().getTime()-hw.sxBegin.getTime();hw.count("flashLoadTime",A);hw.flashIsLoaded=true;hw.isDisplay=true;hw.hidden(hw.loadingDiv)};hw.close=function(){if(!hw.flashIsLoaded){hw.hidden(hw.loadingDiv);hw.hidden(hw.hwDiv);return }if(hw.isDisplay){var A=hw.hasWrite();if(A&&!hw.isCompleteChar){hw.count("noSelectCharClose")}else{if(!A){hw.count("noActionClose")}}hw.hasF=0;hw.isCompleteChar=false;hw.clear();hw.hidden(hw.hwDiv);hw.isDisplay=false}};hw.charSelect=function(I,C){var E=I;var F=hw.input;var H=document;if(C){hw.count("lxz")}if(H.selection&&hw.hasF){hw.input.focus();var D=document.selection.createRange();D.text=E;D.collapse();D.select()}else{if(!H.selection&&(F.selectionStart||F.selectionStart>-1)&&hw.hasF){var G=F.selectionStart;var B=F.selectionEnd;var J=F.value=F.value.substring(0,G)+E+F.value.substring(B,F.value.length);F.selectionStart=G+E.length;F.selectionEnd=G+E.length;var A=navigator.userAgent;if(A.indexOf("Firefox")!=-1){F.focus()}else{F.blur()}}else{var J=F.value;F.focus();F.value=J+E}}hw.isCompleteChar=true};hw.reWrite=function(){hw.count("reWrite")};hw.clear=function(){hw.getMovie("hwflash").clear()};hw.hasWrite=function(){return hw.getMovie("hwflash").hasInput()};hw.display=function(){this.isDisplay=true;hw.show(hw.hwDiv);hw.count("clikeHwLink")};hw.stopClose=function(B){var B=B||window.event;var A=B.target||B.srcElement;if(!hw.flashIsLoaded&&A.tagName.toLowerCase()=="input"){return }if(hw.flashIsLoaded&&A.tagName.toLowerCase()=="input"){hw.hasF=1}hw.stopE(B)};hw.hiddenByKey=function(B){var B=B||w.event;var A;if(B.keyCode&&(B.keyCode==37||B.keyCode==38||B.keyCode==39||B.keyCode==40||B.keyCode==8||B.keyCode==46||B.keyCode==32)){hw.hasF=1;return }else{hw.close();hw.hasF=1}};hw.sx=hw.g("sx");hw.sx.onclick=function(A){hw.stopE(A);if(!hw.flashIsLoaded){var B=hw.loadingDiv.style.left;B.indexOf("-1000px")!=-1?hw.show(hw.loadingDiv):hw.hidden(hw.loadingDiv);hw.show(hw.hwDiv);hw.input.focus();return }if(hw.isDisplay){hw.close()}else{if(document.selection&&document.activeElement.id&&document.activeElement.id!="kw"){hw.hasF=0}hw.display()}};hw.rePos=function(){if(hw.isDisplay){hw.offset=hw.getOffSet(hw.submitBut);hw.show(hw.hwDiv)}};hw.load();hw.count("clikeHwLink");hw.addEvent(document,"click",hw.close);hw.addEvent(hw.loadingDiv,"click",hw.stopClose);hw.addEvent(hw.input,"click",hw.stopClose);hw.addEvent(hw.hwDiv,"click",hw.stopClose);hw.addEvent(hw.loadingDiv,"click",hw.stopClose);hw.addEvent(hw.input,"keydown",hw.hiddenByKey);hw.addEvent(hw.input,"mousedown",function(){hw.hasF=1});hw.addEvent(window,"resize",hw.rePos);

Answer 5

大致写了下，参考吧
test.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>6.0</title>
<style>
body{
font:12px arial;
text-align:center;
background:#fff;
margin-left: 10px;
}
body,p,form{margin:0;padding:0}
body,form{position:relative}
a{color:#00c}a:active{color:#f60}
#su{width:0px;height:0px;line-height:0px; vertical-align:middle}
#hp{position:absolute;line-height:14px;margin:0 0 0 6px;top:-1px;*top:2px}
#sx{color:#00C;text-decoration:underline;cursor:pointer;}
</style>
</head><body>
<div align="left">
  <form name="f" action="s">
    <INPUT id="Title" name="Title" onclick="showVcode(this)" size="60" maxLength="32" style="height:21px;line-height:20px;">
    <br />
    <TEXTAREA name="Content" rows="12" cols="65" id="Content" onclick="showVcode(this)"></TEXTAREA>
    <input id="su" style="width:0px; line-height:0px; height:-10px; padding:0px; *padding:0px; margin-right:0px; font-size:0px">
    <span id="hp"><span id="sx">手写</span></span>
  </form>
</div><script>
function showVcode(obj){
  if (!hw){return;}
  hw.input=obj;
}var hw = {};
var w = window,d = document,n = navigator,k = d.f.wd
var responseElement=d.getElementById("Title")
if (w.attachEvent) {
  w.attachEvent("onload", function() {k.focus();})
}
else {
  w.addEventListener('load', function() {k.focus()},true)
};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", "hwInput.js");
    d.getElementsByTagName("head")[0].appendChild(A);
    il = true;
  }
};
</script>
</body>
</html>

Answer 6

hwInput.js
hw.g = function(A) {
  return document.getElementById(A)
};
hw.input =responseElement;//document.f.kw;/*<------------这里*/hw.isIE = function() {
  if (navigator.userAgent.indexOf("MSIE") > -1) {
    return true
  } else {
    return false
  }
};
hw.submitBut = hw.g("su");
hw.flashIsLoaded = false;
hw.sxBegin;
hw.addEvent = function(B, A, C) {
  B.attachEvent ? B.attachEvent("on" + A, C) : B.addEventListener(A, C, false)
};
hw.stopE = function(A) {
  A = A || window.event;
  A.stopPropagation ? A.stopPropagation() : (A.cancelBubble = true)
};
hw.count = function(B) {
  var A = window["BD_PS_C" + (new Date()).getTime()] = new Image();
  A.src = "http://nsclick.baidu.com/v.gif?pid=201&pj=shouxie&type=" + B + (arguments[1] ? "&costTime=" + arguments[1] : "") + "&t=" + new Date().getTime()
};
hw.getOffSet = function(C) {
  var B = 0;
  var A = 0;
  while (C.offsetParent) {
    B += C.offsetLeft;
    A += C.offsetTop;
    C = C.offsetParent
  }
  if (hw.g("fm") && hw.g("fm").currentStyle && !/msie 8.0/i.test(navigator.userAgent)) {
    B = B - parseInt(hw.g("fm").currentStyle.paddingLeft)
  }
  return {
    l: B,
    t: A + 27
  }
};
hw.offset = hw.getOffSet(hw.submitBut);
hw.hidden = function(A) {
  A.style.left = -1000 + "px";
  A.style.top = -1000 + "px"
};
hw.show = function(A) {
  A.style.left = hw.offset.l + "px";
  A.style.top = hw.offset.t + "px"
};
hw.addStyle = function(B) {
  if (hw.isIE()) {
    var C = document.createStyleSheet();
    C.cssText = B
  } else {
    var A = document.createElement("style");
    A.type = "text/css";
    A.appendChild(document.createTextNode(B));
    document.getElementsByTagName("HEAD")[0].appendChild(A)
  }
};
hw.init = function() {
  var B = [];
  B.push("#hwr_div,#loading{font-size:12px;text-align:center;left:" + hw.offset.l + "px;top:" + (hw.offset.t) + "px;position:absolute;}");
  B.push("#hwr_div.hd,#loading.hd{left:-1000px;top:-1000px;width:1px;height:1px;}");
  B.push("#loading{width:304px; height:239px; border:1px solid #acb5d6;color:#333;}");
  B.push("#loading p{background:#f4f5fa; height:18px; position:relative;padding: 7px 0 0 7px;text-align:left;border-bottom:1px solid #acb5d6;color:#000;margin:0 0 90px 0;}");
  B.push("#loading p img{ position:absolute;right:0; top:0; cursor:pointer;}");
  hw.addStyle(B.join(""));
  var D = document.createDocumentFragment();
  var C = document.createElement("div");
  C.setAttribute("id", "hwr_div");
  var A = document.createElement("div");
  A.setAttribute("id", "loading");
  A.innerHTML = '<p>手写输入<img id="loadingClose" onclick=\'hw.hidden(hw.loadingDiv);hw.hidden(hw.hwDiv)\' src="http://www.baidu.com/hw/sx_close.gif"/></p><div>手写输入法载入中....';
  D.appendChild(C);
  D.appendChild(A);
  document.body.appendChild(D);
  hw.hidden(C);
  hw.hidden(A)
};
hw.init();
hw.loadingDiv = hw.g("loading");
hw.hwDiv = hw.g("hwr_div");
hw.loadingClose = hw.g("loadingClose");
hw.hasFlash = (function() {
  var F = navigator;
  if (F.plugins && F.mimeTypes.length) {
    var C = F.plugins["Shockwave Flash"];
    if (C && C.description) {
      return C.description.replace(/([a-zA-Z]|\s)+/, "").replace(/(\s)+r/, ".") + ".0"
    }
  } else {
    if (window.ActiveXObject && !window.opera) {
      for (var B = 10; B >= 2; B--) {
        try {
          var E = new ActiveXObject("ShockwaveFlash.ShockwaveFlash." + B);
          if (E) {
            var A = E.GetVariable("\x24version");
            return A.replace(/WIN/g, "").replace(/,/g, ".")
          }
        } catch(D) {}
      }
    }
  }
})(); (function() {
  if (typeof(hw.hasFlash) == "undefined") {
    var A = hw.loadingDiv.getElementsByTagName("div")[0];
    A.innerHTML = "对不起，请您先安装flash播放器"
  }
})();
hw.load = function() {
  hw.sxBegin = new Date();
  hw.show(hw.loadingDiv);
  hw.show(hw.hwDiv);
  if (hw.isIE()) {
    hw.hwDiv.innerHTML = '<object width="304" height="239" align="middle" id="hwflash" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"><param name="wmode" value="Opaque"><param value="always" name="allowscriptaccess"><param value="http://www.baidu.com/hw/main.swf" name="movie"></object>'
  } else {
    var A = /Chrome/i.test(navigator.userAgent) ? ' wmode="window" ': ' wmode="Opaque" ';
    hw.hwDiv.innerHTML = '<embed width="304" height="239" align="middle" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="hwflash" src="http://www.baidu.com/hw/main.swf" ' + A + ' allowscriptaccess="always" ver="9.0.0">'
  }
};
hw.getMovie = function(A) {
  return document[A] || window[A]
};
hw.isCompleteChar = false;
hw.isDisplay = false;
hw.ready = function() {
  var A = new Date().getTime() - hw.sxBegin.getTime();
  hw.count("flashLoadTime", A);
  hw.flashIsLoaded = true;
  hw.isDisplay = true;
  hw.hidden(hw.loadingDiv)
};
hw.close = function() {
  if (!hw.flashIsLoaded) {
    hw.hidden(hw.loadingDiv);
    hw.hidden(hw.hwDiv);
    return
  }
  if (hw.isDisplay) {
    var A = hw.hasWrite();
    if (A && !hw.isCompleteChar) {
      hw.count("noSelectCharClose")
    } else {
      if (!A) {
        hw.count("noActionClose")
      }
    }
    hw.hasF = 0;
    hw.isCompleteChar = false;
    hw.clear();
    hw.hidden(hw.hwDiv);
    hw.isDisplay = false
  }
};
hw.charSelect = function(I, C) {
  var E = I;
  var F = hw.input;
  var H = document;
  if (C) {
    hw.count("lxz")
  }
  if (H.selection && hw.hasF) {
    hw.input.focus();
    var D = document.selection.createRange();
    D.text = E;
    D.collapse();
    D.select()
  } else {
    if (!H.selection && (F.selectionStart || F.selectionStart > -1) && hw.hasF) {
      var G = F.selectionStart;
      var B = F.selectionEnd;
      var J = F.value = F.value.substring(0, G) + E + F.value.substring(B, F.value.length);
      F.selectionStart = G + E.length;
      F.selectionEnd = G + E.length;
      var A = navigator.userAgent;
      if (A.indexOf("Firefox") != -1) {
        F.focus()
      } else {
        F.blur()
      }
    } else {
      var J = F.value;
      F.focus();
      F.value = J + E
    }
  }
  hw.isCompleteChar = true
};
hw.reWrite = function() {
  hw.count("reWrite")
};
hw.clear = function() {
  hw.getMovie("hwflash").clear()
};
hw.hasWrite = function() {
  return hw.getMovie("hwflash").hasInput()
};
hw.display = function() {
  this.isDisplay = true;
  hw.show(hw.hwDiv);
  hw.count("clikeHwLink")
};
hw.stopClose = function(B) {
  var B = B || window.event;
  var A = B.target || B.srcElement;
  if (!hw.flashIsLoaded && A.tagName.toLowerCase() == "input") {
    return
  }
  if (hw.flashIsLoaded && A.tagName.toLowerCase() == "input") {
    hw.hasF = 1
  }
  hw.stopE(B)
};
hw.hiddenByKey = function(B) {
  var B = B || w.event;
  var A;
  if (B.keyCode && (B.keyCode == 37 || B.keyCode == 38 || B.keyCode == 39 || B.keyCode == 40 || B.keyCode == 8 || B.keyCode == 46 || B.keyCode == 32)) {
    hw.hasF = 1;
    return
  } else {
    hw.close();
    hw.hasF = 1
  }
};
hw.sx = hw.g("sx");
hw.sx.onclick = function(A) {
  hw.stopE(A);
  if (!hw.flashIsLoaded) {
    var B = hw.loadingDiv.style.left;
    B.indexOf("-1000px") != -1 ? hw.show(hw.loadingDiv) : hw.hidden(hw.loadingDiv);
    hw.show(hw.hwDiv);
    hw.input.focus();
    return
  }
  if (hw.isDisplay) {
    hw.close()
  } else {
    if (document.selection && document.activeElement.id && document.activeElement.id != "kw") {
      hw.hasF = 0
    }
    hw.display()
  }
};
hw.rePos = function() {
  if (hw.isDisplay) {
    hw.offset = hw.getOffSet(hw.submitBut);
    hw.show(hw.hwDiv)
  }
};
hw.load();
hw.count("clikeHwLink");
hw.addEvent(document, "click", hw.close);
hw.addEvent(hw.loadingDiv, "click", hw.stopClose);
hw.addEvent(hw.input, "click", hw.stopClose);
hw.addEvent(hw.hwDiv, "click", hw.stopClose);
hw.addEvent(hw.loadingDiv, "click", hw.stopClose);
hw.addEvent(hw.input, "keydown", hw.hiddenByKey);
hw.addEvent(hw.input, "mousedown",
function() {
  hw.hasF = 1
});
hw.addEvent(window, "resize", hw.rePos);

Answer 7

注意：
1、HTML文件和JS文件放同一目录下测试。
2、只在IE6测试了一下，没做兼容
3、式样也没搞