当文本框输入带小数的值时,在第二个文本框中显示相同的值



有什么方法可以做到这一点吗?当我输入一个带小数的值时,我的第二个文本框将在没有逗号的情况下进行复制,并复制小数值。我怎样才能做到这一点?我提供了我的JS小提琴和下面的代码。任何帮助都将不胜感激。谢谢

function updateTextView(_obj) {
var num = getNumber(_obj.val());
if (num == 0) {
_obj.val('');
$("#textbox2").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() {
$('#textbox1').on('keyup', function() {
updateTextView($(this));
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="" id="textbox1" placeholder="Enter Amount" />
<input type="text" value="" id="textbox2" name="amount" />

您只需要为','使用replaceAll函数

function updateTextView(_obj) {
var num = getNumber(_obj.val());
if (num == 0) {
_obj.val('');
$("#textbox2").val('');
} else {
$("#textbox2").val(num);
_obj.val(num.toLocaleString());
}
}

function getNumber(_str) {
var out = _str.replaceAll(",", "")
return Number(out);
}
$(document).ready(function () {
$('#textbox1').on('blur', function () {
updateTextView($(this));
});
});
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<input type="text" value="" id="textbox1" placeholder="Enter Amount" />
<input type="text" value="" id="textbox2" name="amount" />

如果没有JQuery,这也可以完成任务。您可以尝试在W3学校上正确学习Vanilla JavaScript。我希望你喜欢

function updateTextView(_obj) {
var num = _obj.value;
if (parseFloat(num) == 0) {
num = ''
}
document.getElementById("textbox2").value = num;
} 



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]);
}
}
}
<input type="number" onchange="updateTextView(this)" type="text" value="" id="textbox1" placeholder="Enter Amount"/>
<input type="text" value="" id="textbox2" name="amount"/>

重要提示:只有在必要时才使用库,尽量不要将库用于可以使用Pure JS完成的事情。

最新更新