我遇到问题,仅在firefox中,当输入被聚焦时,我将输入类型从"text"
更改为"number"
,触发更改事件并且输入丢失对焦。
我想要实现的是将输入更改为焦点上的数字字段,允许编辑,并在模糊时更改输入toLocaleString()。
以下是我的代码:
$("input").focusin(function() {
$(this).val(toNumber($(this).val()));
$(this).attr("type", "number");
});
$("input").focusout(function() {
$(this).attr("type", "text");
$(this).val("$ " + toCost($(this).val()));
});
// Added during edit to make code testable
$('input').on('change', function(){ console.log('changed'); })
function parseNumber(value) {
var result = parseFloat(toNumber(value));
if (!isNaN(result)) {
return result;
}
return 0;
}
function toNumber(str) {
return str.replace(/\s/g, "").replace(/\$/g, "").replace(/,/g, "");
}
function toCost(number) {
return parseNumber(number).toLocaleString();
}

<!-- Added during edit to make code testable -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input/>
&#13;
我无法弄清楚为什么在Firefox中输入会触发更改事件并在我选择时失去焦点。当我尝试在控制台上使用$("#myInput").focusin()
时,它按照我想要的方式工作。
它适用于Chrome和Microsoft Edge。
先谢谢你看看这个!
答案 0 :(得分:0)
我目前正在使用它作为解决方案:
$(function() {
if(window.location.hash === "#someid") {
//do something
}
});
function is_firefox() {
return navigator.userAgent.search("Firefox") >= 0;
}
$("input").focusin(onFocusIn);
$("input").focusout(onFocusOut);
$('input').change(onInputChange);
function onFocusIn() {
$(this).val(toNumber($(this).val()));
$(this).attr("type", "number");
// remove on 'change' and 'focusout', and add back after a short delay
if (is_firefox()) {
$(this).off("change");
$(this).off("focusout");
setTimeout(function(element){
element.change(onInputChange);
element.focusout(onFocusOut);
}, 15, $(this));
}
}
function onFocusOut() {
$(this).attr("type", "text");
$(this).val("$ " + toCost($(this).val()));
}
function onInputChange() {
console.log("changed");
}
$("input").focusout();
function parseNumber(value) {
var result = parseFloat(toNumber(value));
if (!isNaN(result)) {
return result;
}
return 0;
}
function toNumber(str) {
return str.replace(/\s/g, "").replace(/\$/g, "").replace(/,/g, "");
}
function toCost(number) {
return parseNumber(number).toLocaleString();
}
我不认为这是完美的解决方案,但它现在适用于我。