能否为type="number"的input元素赋值？赋值后属性值错误咨询
1. Can you set the value attribute for a type="number" input?
Yep, you definitely can set the value attribute on a type="number" input—but there's an important rule to follow: the value has to be a valid numeric value under HTML's rules. That means it needs to be parseable as a floating-point number: no leading zeros (unless it's just "0"), no letters or symbols, and it can't be something like "012345" because leading zeros aren't allowed in standard numeric values.
2. Why am I seeing an "invalid value" error for my phone number?
The problem here is that even though your phone number is all digits, HTML's type="number" input treats it as a numeric value—not a text string. Phone numbers are identifiers, not numbers you'd add or multiply, so they often don't fit the strict numeric rules.
For example, if your phone number starts with a zero (like 0987654321), the browser sees that as an invalid number because leading zeros aren't permitted in standard numbers. Even though it displays correctly on the page, the browser's validation engine flags it as invalid, hence the console error.
How to fix this
The best solution is to use type="tel" instead of type="number" for phone numbers. It's purpose-built for this use case:
- It works with your existing
patternattribute to enforce the 10-digit format. - It skips the strict numeric validation that's causing the error.
- On mobile devices, it still brings up the numeric keypad, just like
type="number"does.
Here's your adjusted code:
<input type="tel" class="form-control" value="<?php echo $profileinfo[0]['mobile_number']; ?>" name="profile[mobileno]" pattern="^\d{10}$" required title="format : xxxxxxxxxx">
If you really insist on using type="number" (though I don't recommend it), you'd have to strip any leading zeros from the phone number before setting it as the value. But again, type="tel" is the correct choice here because phone numbers aren't actual numeric values in most contexts.
内容的提问来源于stack exchange，提问作者ManharSinh Zala
