...

View Full Version : willing to pay some money to get this done



xiaodao
09-01-2006, 08:00 AM
i want to build a form which consist of a text area( TEXTAREA A)
when i enter some text into the textfield , i can press a hotkey on the keyboard maybe "q" or "p" something, then a a layer or a window will pop up, which consist another form with two textfield, i can enter some numbers into these two text field, then press submit, the numbers entered will auto attach to the back of the text in my TEXTAREA A, can it be done in javascript? if you can help me, will be very appreciated, if you want some service charge, you can also pm me your price.. thanks..

vwphillips
09-01-2006, 10:32 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Universal PopUp II</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<meta http-equiv="imagetoolbar" content="no">


<style type="text/css">
<!--

.TxtArea { font-size:12px;background-color:#f8cd76; }
.Title1 { font-size:24px; }
.Title2 { font-size:18px; }
}

-->
</style>
<style type="text/css">
<!--
.class1 {
width:200px;border:solid black 1px;background-color:#FFFFCC;
}

.class2 {
width:200px;border:solid black 1px;background-color:#FFCC66;
}

.zxcclass {
width:200px;border:solid black 1px;background-color:#FFCC66;
}

.class3 {
width:350px;
}

.class4 {
width:400px;
text-align:center;
background-color:white;
}

.Mask{
background-image: url(http://www.vicsjavascripts.org.uk/StdImages/Mask.gif);
}

.Mask2{
background-color:#FFCC66;
}

-->
</style>

<script type="text/javascript">
<!--
// Universal PopUp II (28-August-2006)
// by Vic Phillips - http://www.vicsjavascripts.org.uk

// The 'Universal PopUp' may display an element defined in the HTML code.
// A 'Mask' containing an image which, may be a transparent .png,
// is positioned under the 'Universal PopUp' to obscure the page thus highlighting the 'Universal PopUp'.
// The 'Universal PopUp' would normally be centered in the window
// but may be positioned relative to the element calling the 'Universal PopUp'.
// The 'Mask' and 'Universal PopUp' may be hidden by clicking the 'Mask'
// or by an event call to function 'zxcUPUHide'.
// Optional code allows the 'Universal PopUp' to be 'drag and dropped'
// by an onmousedown event call to function 'zxcUPUDrag' and ReSized by dragging the edges.

// ***** Application Notes.
//

// The 'Universal PopUp' will be referred to as 'UPU'.


// ***** The HTML Code.
//
// The elements to be displayed in the 'U PopUp' are defined in the HTML Code
// and must be nested in a <DIV> which must be assigned a unique ID name.
// e.g.
// <div id="Content">
//
// <form>
// Form 1<br>
// <input ><br>
// <input ><br>
// <input ><br>
// <input ><br>
// </form>
//
// <form>
// Form 2<br>
// <input ><br>
// <input ><br>
// <input ><br>
// <input ><br>
// <input ><br>
// <input ><br>
// <input ><br>
// </form>
//
// <div style="position:relative;height:50px;width:100%;background-color:red;" >
// This could contain standard title, close, drag and drop etc.
// </div>
//
// </div>
//
// In the example each of the three child elements( 1 to 3)
// are removed from the <DIV> during initialisation and may be used as the 'U PopUp' content.


// ***** The Mask.
//
// The 'Mask' utilizes the 'Content' <DIV> with the style modified to meet the 'Mask' requirements.
// The 'Mask' must have a background image, this must be defined in a CSS Class Rule.
// e.g.
// .Mask{ background-image: url(Mask.png); }
//
// * html .Mask{
// background-color: #333;
// back\ground-color: transparent;
// background-image: url(Blank.gif);
// filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="Mask.png", sizingMethod="scale");
// }
//
//


// ***** The Appearance of the 'U PopUp'.
//
// The appearance is dependent on the content but may be modified by CSS Class Rules
// e.g.
// .class1 { width:200px;border:solid black 1px;background-color:#FFFFCC; }
// .class2 { width:200px;border:solid black 1px;background-color:#FFCC66; }
//


// ***** Initialising the Script.
//
// The script would normally be initialised from a <BODY> or window onload event
// e.g.
// <body onload="zxcUPUInit('Content','class1','Mask',10,40);">
// where:
// parameter 0 = the unique ID name of the 'Content' <DIV>. (string)
// parameter 1 = the default class rule to be used for the 'U PopUp'. (string)
// parameter 2 = the class rule to be used for the 'Mask'. (string)
// parameter 3 = the z-index of 'Mask' and 'U PopUp' which must be above other page elements. (digits, defaults to 10)
// parameter 4 = (Part 2 Code Required) to apply an opacity to the 'Mask'. (digits, 1 to 100)
// parameter 5 = (Part 2 Code Required) an image to use for the 'ReSize' of the 'Universal PopUp' edges. (string)
//


// ***** Activating the U PopUp.
//
// The 'U PopUp' would normally be activated by an OnClick event call to function 'zxcUPUShow'
// e.g.
// <span onclick="zxcUPUShow(1);" >LINK 1</span> |
// <span onclick="zxcUPUShow(2,'class2',3);" >LINK 2</span> |
// <input type="button" name="" value="Test" onclick="zxcUPUShow(2,'class2',3,null,['',50,-20]);" >
// where:
// parameter 0 = the number of the 'Content' element. (digit)
// parameter 1 = (optional) the class rule name defining the appearance of the 'U PopUp'. (string or null to use the default)
// parameter 2 = (optional) an additional cloned 'Content' element to add to the 'U PopUp'. (digit or null if not required)
// parameter 3 = (optional) the class rule name defining the appearance of the 'Mask'. (string or null to use the default)
// parameter 4 = (optional, Part 2 Code Required) an array defining options
// field 0 = strings defining options.
// '', - use defaults
// 'NoReSize' - No Edge Resize
// 'NoMask' - No Mask
// 'NoHide' - Clicking the Mask will not Hide the Mask
// or combinations of e.g. 'NoReSizeNoMask'
// fields 1 and 2 must be completed to position of the 'U PopUp' offset from the activating element
// field 1 = the horizontal(X) offset. (digits)
// field 2 = the vertical(Y) offset. (digits)
//
// Parameters may be omitted from the right.
//


// **** Hiding the 'Mask' and 'Universal PopUp'.
//
// The 'Mask' and 'Universal PopUp' may be hidden by clicking the 'Mask'
// or by an event call to function 'zxcUPUHide'.
// e.g.
// <div style="position:relative;height:50px;width:100%;background-color:red;" >
// This could contain standard title, close, drag and drop etc.
// <div style="position:relative;height:20px;width:50px;background-color:silver;" onmouseup="zxcUPUHide()" >Hide</div>
// </div>
//
//


// **** 'Drag and Drop' of the 'Universal PopUp'.
//
// Functional Code Part 2 allows the 'Universal PopUp' to be to be 'drag and dropped'
// by an onmousedown event call to function 'zxcUPUDrag'.
// e.g.
// <div style="position:relative;height:50px;width:100%;background-color:red;" >
// This could contain standard title, close, drag and drop etc.
// <div style="position:relative;height:20px;width:50px;background-color:white;" onmousedown="zxcUPUDrag()" >Drag</div>
// </div>
//


// **** 'ReSize' of the 'Universal PopUp'.
//
// Where the Part 2 Code is available and an image file name specified
// as parameter 5 of the initialising call to 'zxcUPUInit',
// the 'Universal PopUp' may be ReSized by dragging the edges.
// The image would normally be a transparent .gif.
//


// **** General.
//
// All variable, function etc. names are prefixed with 'zxc' to minimise conflicts with other JavaScripts
// These characters may be changed to characters of choice using global find and replace
//
// The Functional Code Part 1(about 3.75K) and Part 2(about 4.25K) are best as External JavaScripts.
// The Functional Code Part 2 is optional and may be reduced by including only the required identified functions.
//
// Tested with IE6 and Mozilla FireFox




// **** Functional Code Part 1 - No Need to Change


var zxcUPU=[];

function zxcUPUInit(zxcid,zxccls,zxcmask,zxczindex,zxcopc,zxcimg){
zxczindex=zxczindex||10;
var zxcbdy=document.getElementsByTagName('BODY')[0];
var zxcp=document.getElementById(zxcid);
var zxcchlds=zxcp.childNodes;
zxcUPU[0]=zxcStyle('DIV',{position:'absolute',overflow:'hidden',zIndex:(zxczindex+1)+'',visibility:'hidden'}) ;
zxcUPU[0].className=zxccls;
zxcUPU[1]=null; zxcUPU[2]=zxccls; zxcUPU[3]=zxcp; zxcUPU[4]=null; zxcUPU[5]=zxcmask; zxcUPU[6]=true;
zxcbdy.appendChild(zxcUPU[0]);
for (var zxc0=0;zxc0<zxcchlds.length;zxc0++){ if (zxcchlds[zxc0].nodeType==1){ zxcUPU.push(zxcchlds[zxc0]); } }
for (var zxc1=7;zxc1<zxcUPU.length;zxc1++){ zxcp.removeChild(zxcUPU[zxc1]); }
zxcp.parentNode.removeChild(zxcp);
zxcbdy.appendChild(zxcp);
zxcp.onmouseup=function(){ if (zxcUPU[6]){ zxcUPUHide(); } }
if (window['zxcOpacity']&&zxcopc){ zxcOpacity(zxcp,zxcopc); }
if (window['zxcAddEdge']&&zxcimg){ zxcAddEdge(zxcimg); }
zxcp.className=zxcmask;
zxcStyle(zxcp,{position:'absolute',visibility:'visible',display:'none',zIndex:(zxczindex)+'',left:'0 px',top:'0px'});
}

function zxcUPUShow(zxcelenu,zxccls,zxcadd,zxcmskcls,zxcopt){
var zxcevt=window.event||arguments.callee.caller.arguments[0];
var zxcobj=zxcEventObj(zxcevt);
if (!zxcUPU[0]){ return; }
if (!zxcUPU[zxcelenu+6]){ return; }
zxcUPU[1]=zxcUPU[zxcelenu+6];
zxcUPU[0].appendChild(zxcUPU[1]);
zxcUPU[0].className=zxccls||zxcUPU[2];
zxcUPU[3].className=zxcmskcls||zxcUPU[5];
if (zxcadd){ zxcUPU[4]=zxcUPU[zxcadd+6].cloneNode(true); zxcUPU[0].appendChild(zxcUPU[4]); }
zxcStyle(zxcUPU[3],{display:'',width:(zxcBdyWH()[0])+'px',height:(Math.max(zxcBdyWH()[1],zxcWWHS()[1])-5)+'px'});
zxcStyle(zxcUPU[0],{visibility:'visible',left:(zxcWWHS()[2]+(zxcWWHS()[0]-zxcUPU[0].offsetWidth)/2)+'px',top:(zxcWWHS()[3]+(zxcWWHS()[1]-zxcUPU[0].offsetHeight)/2)+'px'});
if (window['zxcPosEdge']){ zxcPosEdge('visible'); }
if (zxcopt&&window['zxcOptions']){ zxcOptions(zxcobj,zxcopt); }
}

function zxcUPUHide(){
if (zxcUPU[1]){ zxcUPU[0].removeChild(zxcUPU[1]); zxcUPU[1]=null; }
if (zxcUPU[4]){ zxcUPU[0].removeChild(zxcUPU[4]); zxcUPU[4]=null; }
zxcStyle(zxcUPU[0],{visibility:'hidden',width:null,height:null});
if (window['zxcPosEdge']){ zxcPosEdge('hidden'); }
zxcUPU[3].style.display='none';
zxcUPU[6]=true;
}

function zxcStyle(zxcele,zxcstyle){
if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
return zxcele;
}

function zxcWWHS(){
if (window.innerHeight){ return [window.innerWidth,window.innerHeight,window.pageXOffset,window.pageYOffset]; }
if (document.documentElement.clientHeight){ return [document.documentElement.clientWidth,document.documentElement.clientHeight,document.documentElement. scrollLeft,document.documentElement.scrollTop]; }
return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTo p];
}

function zxcBdyWH(){
if (document.body.scrollHeight > document.body.offsetHeight){ return [document.body.scrollWidth,document.body.scrollHeight]; }
return [document.body.offsetWidth,document.body.offsetHeight];
}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
return zxceobj;
}

function zxcPos(zxcobj){
zxclft=zxcobj.offsetLeft;
zxctop=zxcobj.offsetTop;
while(zxcobj.offsetParent!=null){
zxcpar=zxcobj.offsetParent;
zxclft+=zxcpar.offsetLeft;
zxctop+=zxcpar.offsetTop;
zxcobj=zxcpar;
}
return [zxclft,zxctop];
}


//-->
</script>

<script type="text/javascript">
<!--
// Universal PopUp II Part 2 (28-August-2006)
// by Vic Phillips - http://www.vicsjavascripts.org.uk

// Functions for
//
// 1) 'Mask' Opacity.
//
// 2) Options.
// No Edge Resize.
// No Mask.
// Clicking the Mask will not Hide the Mask.
// Position the 'U PopUp' offset from the activating element.
//
// 3) The 'Universal PopUp' to be to be 'drag and dropped' by an onmousedown event call to function 'zxcUPUDrag',
//
// 4) The 'Universal PopUp' resize by dragging the edges.
//


// **** Functional Code Part 2 - No Need to Change


// Required for Opacity
function zxcOpacity(zxcobj,zxcopc){
if (zxcopc<0||zxcopc>100){ return; }
if (zxcobj.style.MozOpacity!=null){ zxcobj.style.MozOpacity=(zxcopc/100)-.001; }
else if (zxcobj.style.opacity!=null){ zxcobj.style.opacity=(zxcopc/100)-.001; }
else if (zxcobj.style.filter!=null){ zxcobj.style.filter = 'alpha(opacity='+zxcopc+')'; }
else if (zxcobj.KHTMLOpacity!=null){ zxcobj.KHTMLOpacity=(zxcopc/100)-.001; }
}

// Required for Options
function zxcOptions(zxcobj,zxcopt){
zxcopt[0]=zxcopt[0].toUpperCase();
if (zxcopt[1]&&zxcopt[2]){ zxcStyle(zxcUPU[0],{left:(zxcPos(zxcobj)[0]+zxcopt[1])+'px',top:(zxcPos(zxcobj)[1]+zxcopt[2])}); }
if (zxcopt[0].match('RESIZE')&&window['zxcPosEdge']){ zxcPosEdge('hidden'); }
if (zxcopt[0].match('MASK')){ zxcUPU[3].style.display='none'; }
if (zxcopt[0].match('HIDE')){ zxcUPU[6]=false; }
}

// Required for Drag
function zxcUPUDrag(){
if (zxcObj){ return; }
var zxcevt=window.event||arguments.callee.caller.arguments[0];
zxcSel();
zxcObj=[zxcUPU[0],zxcMse(zxcevt)[0]-zxcUPU[0].offsetLeft,zxcMse(zxcevt)[1]-zxcUPU[0].offsetTop];
}

// Required for ReSize
function zxcAddEdge(zxcimg){
var zxcdata=[['100%','n-resize'],['100%','s-resize'],['4px','w-resize'],['4px','e-resize']];
for (var zxc0=0;zxc0<4;zxc0++){
zxcdata[zxc0][2]=zxcStyle('IMG',{position:'absolute',zIndex:'10',left:'0px',top:'0px',width:zxcdata[zxc0][0],height:'4px',cursor:zxcdata[zxc0][1]});
zxcdata[zxc0][2].src=zxcimg;
zxcdata[zxc0][2].nu=zxc0;
zxcUPU[0].appendChild(zxcdata[zxc0][2]);
zxcAddEvt(zxcdata[zxc0][2],'zxcMveEdge','mousedown');
}
}

// Required for ReSize
function zxcPosEdge(zxcvis){
if (!zxcUPU[0]){ return; }
var zxcimgs=zxcUPU[0].getElementsByTagName('IMG');
zxcimgs[1].style.top=(zxcUPU[0].offsetHeight-4)+'px';
zxcStyle(zxcimgs[2],{left:(zxcUPU[0].offsetWidth-4)+'px',height:(zxcUPU[0].offsetHeight)+'px'});
zxcimgs[3].style.height=(zxcUPU[0].offsetHeight)+'px';
if (zxcvis){ for (var zxc0=0;zxc0<4;zxc0++){ zxcimgs[zxc0].style.visibility=zxcvis; } }
}

// Required for ReSize
function zxcMveEdge(zxcevt){
if (zxcRSz){ return; }
zxcSel();
var zxcobj=zxcUPU[0];
if (this.nu<2||this.nu=='D'){ zxcRSz=[this.nu,zxcobj.offsetHeight,zxcMse(zxcevt)[1]]; }
if (this.nu>1||this.nu=='R'){ zxcRSz=[this.nu,zxcobj.offsetWidth,zxcMse(zxcevt)[0]]; }
}

// Required for ReSize
function zxcReSize(zxcmse){
var zxcobj=zxcUPU[0];
if (zxcRSz[0]==0){ zxcStyle(zxcobj,{height:(Math.max(zxcRSz[1]+zxcRSz[2]-zxcmse[1],100))+'px',top:(zxcmse[1]-2)+'px'}); }
if (zxcRSz[0]==1){ zxcobj.style.height=(Math.max(zxcRSz[1]+zxcmse[1]-zxcRSz[2],100))+'px'; }
if (zxcRSz[0]==2){ zxcobj.style.width=(Math.max(zxcRSz[1]+zxcmse[0]-zxcRSz[2],100))+'px'; }
if (zxcRSz[0]==3){ zxcStyle(zxcobj,{width:(Math.max(zxcRSz[1]+zxcRSz[2]-zxcmse[0],100))+'px',left:(zxcmse[0]-2)+'px'}); }
zxcPosEdge();
}

// Required for Drag & ReSize
var zxcObj,zxcRSz;
var zxcEvt=0;

// Required for Drag & ReSize
function zxcDragDo(zxcevt){
if (zxcRSz){ zxcReSize(zxcMse(zxcevt)); }
if (!zxcObj){ return; }
zxcObj[0].style.left=(zxcMse(zxcevt)[0]-zxcObj[1])+'px';
zxcObj[0].style.top=(zxcMse(zxcevt)[1]-zxcObj[2])+'px';
}

// Required for Drag & ReSize
function zxcMse(zxcevt){
if (document.all){ return [zxcevt.clientX+zxcDocS()[0],zxcevt.clientY+zxcDocS()[1]]; }
else { return[zxcevt.pageX,zxcMseY=zxcevt.pageY]; }
}

// Required for Drag & ReSize
function zxcDocS(){
if (!document.body.scrollTop){ return [document.documentElement.scrollLeft,document.documentElement.scrollTop]; }
else { return [document.body.scrollLeft,document.body.scrollTop]; }
}

// Required for Drag & ReSize
function zxcMseUp(){ zxcObj=null; zxcRSz=null; document.onselectstart=null; }

// Required for Drag & ReSize
function zxcSel(){ document.onselectstart=function(event){window.event.returnValue=false; } }

// Required for Drag & ReSize
function zxcEventAdd(zxco,zxct,zxcf){
if (zxco.addEventListener){ zxco.addEventListener(zxct, function(e){ zxco[zxcf](e);}, false); }
else if (zxco.attachEvent){ zxco.attachEvent('on'+zxct,function(e){ zxco[zxcf](e); }); }
else {
var zxcPrev=zxco['on'+zxct];
if (zxcPrev){ zxco['on'+zxct]=function(e){ zxcPrev(e); zxco[zxcf](e); }; }
else { zxco['on'+zxct]=zxco[zxcf]; }
}
}

// Required for Drag & ReSize
function zxcAddEvt(zxcobj,zxcfun,zxcevt){
if (zxcobj[zxcevt+'add']){ return; }
zxcobj['zxcaddEvt'+zxcEvt]=window[zxcfun];
zxcobj[zxcevt+'add']=true;
zxcEventAdd(zxcobj,zxcevt,'zxcaddEvt'+zxcEvt);
zxcEvt++;
}

// Required for Drag & ReSize
zxcAddEvt(document,'zxcDragDo','mousemove');
// Required for Drag & ReSize
zxcAddEvt(document,'zxcMseUp','mouseup');

//-->
</script>
<script language="JavaScript" type="text/javascript">
<!--

function Enter(frm){
var obj=document.getElementById('fred');
var eles=frm.elements;
obj.value+=eles[0].value+eles[1].value;
}

function Key(e){
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ KeyCode=e.which; }
else { KeyCode=event.keyCode; }
if (KeyCode==81){
zxcUPUShow(1,'class4',2);
}
}


document.onkeyup=function(event){ Key(event); }

//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<iframe id="zxcTitleIF" src="../Title0.htm" scrolling="no" frameborder="0" style="display:none;overflow:hidden;width:100%;" ></iframe>
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50"></textarea>
<br>

<input class="TxtArea" type="button" name="" value="Test 5" onclick="zxcUPUShow(1,'class4',2);" > | or character 'q'

<br>



<div id="Content" style="position:absolute;overflow:hidden;width:100px;height:100px;visibility:hidden;" >
<form>
Form 2<br>
<input ><br>
<input ><br>
<input type="button" name="" value="Enter" onclick="zxcUPUHide();Enter(this.form);">
</form>

<div style="position:relative;overflow:hidden;height:60px;width:100%;background-color:#FFFFCC;text-align:center;font-size:12px;" >
complete the inputs and enter.
<div style="position:absolute;left:45px;top:35px;height:15px;width:50px;background-color:#FFCC66;border:solid black 1px;cursor:move;" onmousedown="zxcUPUDrag()" >Drag</div>
<div style="position:absolute;left:105px;top:35px;height:15px;width:50px;background-color:silver;border:solid black 1px;" onmouseup="zxcUPUHide()" >Hide</div>
</div>
</div>

<div style="height:900px;" ></div>
</body>

</html>

xiaodao
09-01-2006, 10:46 AM
thanks, but after press "q" , q will be entered...

vwphillips
09-01-2006, 11:50 AM
please clarrify

are you saying that you type q in the text area,and only in the textarea, you want the popup and no q in the textarea?

vwphillips
09-01-2006, 11:58 AM
<script language="JavaScript" type="text/javascript">
<!--

function Enter(frm){
var obj=document.getElementById('fred');
var eles=frm.elements;
obj.value+=eles[0].value+eles[1].value;
}
var Lst='';
function Key(e){
var obj=document.getElementById('fred');
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ KeyCode=e.which; }
else { KeyCode=event.keyCode; }
if (KeyCode==81){
obj.value=Lst;
zxcUPUShow(1,'class4',2);
}
Lst=obj.value;
}



//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50" onkeyup=" Key(event);"></textarea>
<br>

vwphillips
09-01-2006, 12:04 PM
<script language="JavaScript" type="text/javascript">
<!--

function Enter(frm){
var obj=document.getElementById('fred');
var eles=frm.elements;
obj.value+=eles[0].value+eles[1].value;
}
var Lst='';
function Key(e){
var obj=document.getElementById('fred');
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ KeyCode=e.which; }
else { KeyCode=event.keyCode; }
if (KeyCode==81){
obj.value=Lst;
zxcUPUShow(1,'class4',2);
}
Lst=obj.value;
}



//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50" onkeyup=" Key(event);"></textarea>
<br>

xiaodao
09-02-2006, 09:52 AM
if i want to change the short cut key, which part should i change

vwphillips
09-02-2006, 11:29 AM
<script language="JavaScript" type="text/javascript">
<!--

function Enter(frm){
var obj=document.getElementById('fred');
var eles=frm.elements;
obj.value+=eles[0].value+eles[1].value;
}
var Lst='';
function Key(e){
var obj=document.getElementById('fred');
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ KeyCode=e.which; }
else { KeyCode=event.keyCode; }
// the alert will show key code
alert(String.fromCharCode(KeyCode)+' = '+KeyCode);
if (KeyCode==81){
obj.value=Lst;
zxcUPUShow(1,'class4',2);
}
Lst=obj.value;
}
// a link with key codes
// http://www.zyra.org.uk/kcodes.htm

//-->
</script>

vwphillips
09-05-2006, 09:01 AM
from pm
if i have several textarea in one page, each textarea i want to have same pop up then fill in function what shall i do? if i want the two values i entered in new form to be in the format of |value1|value2 when attached to old form, what to do?

vwphillips
09-05-2006, 09:25 AM
.............

<script language="JavaScript" type="text/javascript">
<!--

var zxcTAObj='';

function Enter(frm){
var eles=frm.elements;
zxcTAObj.value+='|'+eles[0].value+'|'+eles[1].value;
eles[0].value='';
eles[1].value='';
}

function Key(e){
var zxcevt=window.event||arguments.callee.caller.arguments[0];
var zxcobj=zxcEventObj(zxcevt);
if (!zxcobj.last){ zxcobj.last=''; }
zxcTAObj=zxcobj;
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ KeyCode=e.which; }
else { KeyCode=event.keyCode; }
if (KeyCode==81){
zxcobj.value=zxcobj.last;
zxcUPUShow(1,'class4',2);
}
zxcobj.last=zxcobj.value;
}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
return zxceobj;
}



//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50" onkeyup=" Key(event);"></textarea>
<div style="height:80px;" ></div>
<textarea rows="20" cols="50" onkeyup=" Key(event);"></textarea>
<br>
<br>



<div id="Content" style="position:absolute;overflow:hidden;width:100px;height:100px;visibility:hidden;" >
<form>
Form 2<br>
<input ><br>
<input ><br>
<input type="button" name="" value="Enter" onclick="zxcUPUHide();Enter(this.form);">
</form>

<div style="position:relative;overflow:hidden;height:60px;width:100%;background-color:#FFFFCC;text-align:center;font-size:12px;" >
complete the inputs and enter.
<div style="position:absolute;left:45px;top:35px;height:15px;width:50px;background-color:#FFCC66;border:solid black 1px;cursor:move;" onmousedown="zxcUPUDrag()" >Drag</div>
<div style="position:absolute;left:105px;top:35px;height:15px;width:50px;background-color:silver;border:solid black 1px;" onmouseup="zxcUPUHide()" >Hide</div>
</div>
</div>

<div style="height:900px;" ></div>
</body>

</html>

vwphillips
09-07-2006, 09:39 PM
.................
<script language="JavaScript" type="text/javascript">
<!--

var zxcTAObj;

function Enter(frm){
var eles=frm.elements;
zxcTAObj.value=zxcTAObj.value.substring(0,zxcTAObj.value.length-1);
zxcTAObj.value+='|'+eles[0].value+'|'+eles[1].value;
eles[0].value='';
eles[1].value='';
}

function Key(e){
var zxcevt=window.event||arguments.callee.caller.arguments[0];
var zxcobj=zxcEventObj(zxcevt);
if (!zxcobj.last){ zxcobj.last=''; }
zxcTAObj=zxcobj;
var zxckc;
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ zxcck=e.which; }
else { zxcck=event.keyCode; }
var zxcchar=String.fromCharCode(zxcck);
if (zxcchar=='q'){
zxcUPUShow(1,'class4',2);
}
}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
return zxceobj;
}


if (!document.all){ document.captureEvents(Event.KEYDOWN); }


//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50" onkeypress="Key(event);" ></textarea>
<div style="height:80px;" ></div>
<textarea rows="20" cols="50" onkeyup=" Key(event);"></textarea>
<br>
<br>



<div id="Content" style="position:absolute;overflow:hidden;width:100px;height:100px;visibility:hidden;" >
<form>
Form 2<br>
<input ><br>
<input ><br>
<input type="button" name="" value="Enter" onclick="zxcUPUHide();Enter(this.form);">
</form>

<div style="position:relative;overflow:hidden;height:60px;width:100%;background-color:#FFFFCC;text-align:center;font-size:12px;" >
complete the inputs and enter.
<div style="position:absolute;left:45px;top:35px;height:15px;width:50px;background-color:#FFCC66;border:solid black 1px;cursor:move;" onmousedown="zxcUPUDrag()" >Drag</div>
<div style="position:absolute;left:105px;top:35px;height:15px;width:50px;background-color:silver;border:solid black 1px;" onmouseup="zxcUPUHide()" >Hide</div>
</div>
</div>

<div style="height:900px;" ></div>
</body>

</html>

xiaodao
09-08-2006, 01:10 AM
thanks for help, there is a problem the second form cannot use the key..

vwphillips
09-08-2006, 08:17 AM
change the call in the second area to

onkeypress="Key(event);"

xiaodao
09-08-2006, 12:25 PM
Thanks, but the q is still in the field instead of disappear and is it possible to have the cursor in the new form when press "q"?

vwphillips
09-08-2006, 02:05 PM
the q was removed when enter pressed

but


<script language="JavaScript" type="text/javascript">
<!--

var zxcTAObj;

function Enter(frm){
var eles=frm.elements;
zxcTAObj.value+='|'+eles[0].value+'|'+eles[1].value;
eles[0].value='';
eles[1].value='';
zxcTAObj.focus();
zxcTAObj=null;
}

function Key(e){
var zxcevt=window.event||arguments.callee.caller.arguments[0];
var zxcobj=zxcEventObj(zxcevt);
if (!zxcobj.last){ zxcobj.last=''; }
zxcTAObj=zxcobj;
var zxckc;
if (zxcUPU[0].style.visibility=='visible'){ return; }
if (!document.all){ zxcck=e.which; }
else { zxcck=event.keyCode; }
var zxcchar=String.fromCharCode(zxcck);
if (zxcchar=='q'){
zxcUPUShow(1,'class4',2);
document.getElementById('First').focus();
return false;
}
return true;
}

function zxcEventObj(zxce){
if (!zxce) var zxce=window.event;
zxce.cancelBubble=true;
if (zxce.stopPropagation) zxce.stopPropagation();
if (zxce.target) zxceobj=zxce.target;
else if (zxce.srcElement) zxceobj=zxce.srcElement;
if (zxceobj.nodeType==3) zxceobj=zxceobj.parentNode;
return zxceobj;
}


if (!document.all){ document.captureEvents(Event.KEYDOWN); }


//-->
</script>
<script type="text/javascript">
<!--

function InitScripts(){
zxcUPUInit('Content','class1','Mask',10,50,'http://www.vicsjavascripts.org.uk/StdImages/Mask.gif');
}

//-->
</script>


</head>

<body bgColor="#f8cd76" onload="InitScripts()" >
<center>
<div style="height:80px;" ></div>
<textarea id="fred" rows="20" cols="50" onkeypress="return Key(event);" ></textarea>
<div style="height:80px;" ></div>
<textarea rows="20" cols="50" onkeypress="return Key(event);" ></textarea>
<br>
<br>



<div id="Content" style="position:absolute;overflow:hidden;width:100px;height:100px;visibility:hidden;" >
<form>
Form 2<br>
<input id="First" ><br>
<input ><br>
<input type="button" name="" value="Enter" onclick="zxcUPUHide();Enter(this.form);">
</form>

<div style="position:relative;overflow:hidden;height:60px;width:100%;background-color:#FFFFCC;text-align:center;font-size:12px;" >
complete the inputs and enter.
<div style="position:absolute;left:45px;top:35px;height:15px;width:50px;background-color:#FFCC66;border:solid black 1px;cursor:move;" onmousedown="zxcUPUDrag()" >Drag</div>
<div style="position:absolute;left:105px;top:35px;height:15px;width:50px;background-color:silver;border:solid black 1px;" onmouseup="zxcUPUHide()" >Hide</div>
</div>
</div>

<div style="height:900px;" ></div>
</body>

</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum