简体   繁体   English

在焦点对准的相应文本框中输入按钮值

[英]input a button value on corresponding textbox that is on focus

I am trying to create a touchscreen calculator like where the button value will be placed on the textbox after i set it on a focus by clicking but it appears on all the textboxes.I tried to use the code 我试图创建一个触摸屏计算器,例如在通过单击将其设置为焦点之后将按钮值放置在文本框上,但是它将出现在所有文本框上。

if ($(impo).is(":focus")) {

but it doesnt work. 但它不起作用。 Please see my snippet Thanks in advance! 请先查看我的代码段,谢谢!

 var impo = document.getElementById("imp_text"); var tess = document.getElementById("tess_text"); var FKeyPad = document.Keypad; var Accumulate = 0; var FlagNewNum = false; var PendingOp = ""; document.getElementById('tess').onclick = function() { document.getElementById('tess_text').focus(); } document.getElementById('imp').onclick = function() { document.getElementById('imp_text').focus(); } function NumPressed(Num) { if (impo) { if (FlagNewNum) { FKeyPad.ReadOut.value = Num; FlagNewNum = false; } else { if (FKeyPad.ReadOut.value == " ") FKeyPad.ReadOut.value = Num; else FKeyPad.ReadOut.value += Num; } } if (tess) { if (FlagNewNum) { FKeyPad.readtess.value = Num; FlagNewNum = false; } else { if (FKeyPad.readtess.value == " ") FKeyPad.readtess.value = Num; else FKeyPad.readtess.value += Num; } } } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <html lang="en"> <head> </head> <body> <form name="Keypad" action=""> <input type="button" value="Imp" id="imp" /> Importo : <input name="ReadOut" id="imp_text" type="Text" value=" "> <br> <input type="button" value="Tes" id="tess" /> Card Tess : <input name="readtess" id="tess_text" type="Text" value=" "> <br> <input type="button" value=" 1" onclick="NumPressed(1)" /> <input type="button" value=" 2" onclick="NumPressed(2)" /> <input type="button" value=" 3" onclick="NumPressed(3)" /> <br> </form> </body> </html> 

if (impo) and if (tess) just tests whether the element exists, which they do, so the value gets written to both of them because they both exist. if (impo)if (tess)只是测试元素是否存在(它们确实存在),因此将值写入它们两个,因为它们都存在。 In a desktop environment, you can't do what you're asking - you can give a textbox the focus, but once the user clicks on one of the buttons in order to select that number, the textbox no longer has the focus (because the button has it). 在桌面环境中,您无法执行要求的操作-可以给文本框指定焦点,但是一旦用户单击其中一个按钮以选择该数字,则文本框将不再具有焦点(因为该按钮有它)。

You need a separate way to maintain which textbox is currently selected, something like the snippet below. 您需要一种单独的方式来维护当前选中的文本框,类似于下面的代码片段。 It will update the currently "selected" element both on the click of the Imp/Tes buttons and whenever either of the textbox gains focus (eg by mouse click or touch). 单击“ Im / Tes”按钮,以及每当两个文本框都获得焦点时(例如,通过鼠标单击或触摸),它将更新当前“选定”的元素。

 var impo = document.getElementById("imp_text"); var tess = document.getElementById("tess_text"); var current_input = impo; impo.onfocus = function() { current_input = impo; } tess.onfocus = function() { current_input = tess; } document.getElementById('tess').onclick = function() { current_input = tess; tess.focus(); } document.getElementById('imp').onclick = function() { current_input = impo; impo.focus(); } function NumPressed(Num) { current_input.value += Num; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <html lang="en"> <head> </head> <body> <form name="Keypad" action=""> <input type="button" value="Imp" id="imp" /> Importo : <input name="ReadOut" id="imp_text" type="Text" value=""> <br> <input type="button" value="Tes" id="tess" /> Card Tess : <input name="readtess" id="tess_text" type="Text" value=""> <br> <br> <input type="button" value="1" onclick="NumPressed(this.value)" /> <input type="button" value="2" onclick="NumPressed(this.value)" /> <input type="button" value="3" onclick="NumPressed(this.value)" /> <br> <input type="button" value="4" onclick="NumPressed(this.value)" /> <input type="button" value="5" onclick="NumPressed(this.value)" /> <input type="button" value="6" onclick="NumPressed(this.value)" /> <br> <input type="button" value="7" onclick="NumPressed(this.value)" /> <input type="button" value="8" onclick="NumPressed(this.value)" /> <input type="button" value="9" onclick="NumPressed(this.value)" /> <br> <input type="button" value="0" onclick="NumPressed(this.value)" /> <br> </form> </body> </html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM