是否可以在type数字的input字段中显示字符串？
我想做这样的事情：
<input value="4'000" placeholder="Type some numbers" type="number" />
它将始终显示占位符，因为 "4'000" 有一个 撇号，因此是一个字符串。
关于如何在数字类型的输入中显示字符串（如果可能没有包 - 我正在使用 React）有什么想法吗？
谢谢！
【问题讨论】：
number 那么为什么 撇号？如果您需要string，那么必须将input 类型作为number，您可以将text 作为输入类型吗？因此，如果您可以分享用例，那么告诉任何事情都会好得多。
标签： javascript html reactjs string input
来自 WDN 网络文档input type="number"
数字类型的输入元素用于让用户输入数字。它们包括用于拒绝非数字条目的内置验证。
所以你不能在数字输入中显示字符串。
但你可以将“4'000”转换为“4000”，并显示为一个数字：
"4'000".replaceAll("'", "") // => "4000"
<input value="4000" placeholder="Type some numbers" type="number">
【讨论】：
<input type="text"> HTML Input type number Thousand separator
因此，在您在值字段上添加 value 之前，您可以先“处理”它以删除值上的所有非数字内容：
使用这个功能：
\D 是匹配所有非数字的简写正则表达式。
const stripNonNumeric = str => str.replace(/\D/g,'');
（如果你正在使用状态）
const [val, setVal] = useState(stripNonNumeric(props.defaultValue));
const onChangeValue = (e) => {
// this should be unnecessary if the field is already type="number",
// but if its not then this use this, else just use e.target.value
const value = stripNonNumeric(e.target);
setVal(value);
};
return <input type="number" value={val} onChange={onChangeValue} />;
如果您从其他地方获得价值：
const value = props.valFromSomewhere;
return <input type="number" value={stripNonNumeric(value)} />;
【讨论】：
将input type 用作number 对于rational/integers 而不是字符串 的值会更好。
因此，在您的情况下，您可以使用text 作为输入字段以获得更好的可读性，并且在 javascript 中您可以将该字符串转换为数字。
let num = document.getElementById("some-number").value;
num = num.replace(/\'/g,'');
num = parseInt(num,10);
console.log(num);<input type="text" value="4'000" id="some-number" />【讨论】：