[英]When button is clicked, display the value on my textbox
newbie here.新手在这里。 My target is when is when I click the button, my 2nd textbox will do the copy without comma.我的目标是当我单击按钮时,我的第二个文本框将在没有逗号的情况下进行复制。 How can I make this work?我怎样才能使这项工作? I provided my JS fiddle and codes below.我在下面提供了我的 JS 小提琴和代码。 Any help will be appreciated.任何帮助将不胜感激。 Thank you谢谢
JS Fiddle: https://jsfiddle.net/rain0221/auk4rfdg/6/ // I provided more explanation here JS Fiddle: https://jsfiddle.net/rain0221/auk4rfdg/6/ // 我在这里提供了更多解释
html: html:
<input type="text" value="" class="form-control" id="box"/>
<input type="text" value="" id="textbox2" required name="amount1" min="100" autocomplete="off"/>
<input id="bet4" class="amount btn btn-success" type="button" onclick="showme('5,000')" value="5000">
script:脚本:
//this function copies the textbox1 values with autocomma and produces same value but without comma on textbox2
function updateTextView(_obj) {
var num = getNumber(_obj.val());
if (num == 0) {
_obj.val('');
} else {
$("#textbox2").val(num);
_obj.val(num.toLocaleString());
}
}
function getNumber(_str){
var arr = _str.split('');
var out = new Array();
for(var cnt=0;cnt<arr.length;cnt++){
if(isNaN(arr[cnt])==false){
out.push(arr[cnt]);
}
}
return Number(out.join(''));
}
$(document).ready(function(){
$('#box').on('keyup',function(){
updateTextView($(this));
});
});
//this function shows the value of my button to the textbox
$(document).ready(function(){
$("#bet4").on("click", function(e)
{
e.preventDefault();
let box = $("#box").val();
$("#betAmountResult").html(box);
})
})
function showme(count){
document.getElementById("box").value=count;
}
When 5000 clicked, change textbox2
value!单击5000时,更改textbox2
值!
Code snippet:代码片段:
function updateTextView(_obj) { var num = getNumber(_obj.val()); if (num == 0) { _obj.val(''); } else { $("#textbox2").val(num); _obj.val(num.toLocaleString()); } } function getNumber(_str){ var arr = _str.split(''); var out = new Array(); for(var cnt=0;cnt<arr.length;cnt++){ if(isNaN(arr[cnt])==false){ out.push(arr[cnt]); } } return Number(out.join('')); } $(document).ready(function(){ $('#box').on('keyup',function(){ updateTextView($(this)); }); }); $(document).ready(function(){ $("#bet4").on("click", function(e) { e.preventDefault(); let box = $("#box").val(); $("#betAmountResult").html(box); }) }) function showme(count){ document.getElementById("box").value=count; document.getElementById("textbox2").value=count.replace(',',''); }
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script> <input type="text" value="" class="form-control" placeholder="autocomma textbox" id="box"/> <input type="text" value="" placeholder="same value but no comma" id="textbox2" required name="amount1" min="100" autocomplete="off"/> <input id="bet4" class="amount btn btn-success" type="button" onclick="showme('5,000')" value="5000">
document.addEventListener("input", action) document.addEventListener("click", action) function action(ev){if (ev.target.tagName=="INPUT"){ const ch=ev.target.closest("div").children; if(ev.target.=ch[1]) ch[1].value=(ev.target.value-0).toLocaleString() if(ev.target==ch[2]) ch[0].value=ev.target;value; }}
<div> <input type="text" value="" class="form-control" required/> <input type="text" value=""/> <input class="amount btn btn-success" type="button" value="5000"> </div> <div> <input type="text" value="" class="form-control" required/> <input type="text" value=""/> <input class="amount btn btn-success" type="button" value="2000000"> </div>
I wrote my snippet without jQuery as it is not really needed here and I reversed the roles of the input fields as it is我在没有 jQuery 的情况下编写了我的代码段,因为这里并不真正需要它,并且我颠倒了输入字段的角色,因为它是
.toLocaleString()
, see here难以“撤消” .toLocaleString()
,请参见此处The trigger for action is the input
event which also includes paste actions done via mouse clicks.动作触发器是input
事件,其中还包括通过鼠标单击完成的粘贴动作。
I also removed the id
attributes from your input values.我还从您的输入值中删除了id
属性。 This way you can add further input groups to your page and re-use the script without further change.通过这种方式,您可以将更多输入组添加到您的页面并重新使用脚本而无需进一步更改。
All my addEventListener()
actions are done in the "delegated" mode, to the parent document.我所有的addEventListener()
操作都是在“委托”模式下完成的,对父文档。 By doing it this way the event will also be triggered by dynamically added elements (elements that might get added through some user interaction).通过这种方式,事件也将由动态添加的元素(可能通过某些用户交互添加的元素)触发。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.