在"电话号码"输入框中只能输入号码。代码如下。此外，我希望用户在"名称"输入框中只输入文本。请帮助使用简单的js。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
<!DOCTYPE html>
<html>
<head>
<title>Navya Malhotra - Contact Us</title>
<link rel="stylesheet" href="styles/style.css" type="text/css">
<link rel="stylesheet" href="styles/contact.css" type="text/css">
<script>
var h2 = document.getElementById('h2')
function setValue(e, el) {
var element = document.getElementById(el)
element.innerHTML = e;
}
</script>
</head>
<body>
<div class="navbar">
<div class="title">
<p><span style="font-size: 50px;">N</span>avya <span style="font-size: 50px;">M</span>alhotra</p>
</div>
<div class="main-menu">
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="products.html">Products</a></li>
<li><a href="about.html">About Us</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
<div class="nav_links">
<ul>
<li><a href="https://youtube.com" target="_"><img src="pics/Youtube.png" alt="The Source is down" style="height: 45px;"></a></li>
<li><a href="https://www.instagram.com/navya_malhotra_01/" target="_1"><img src="pics/Instagram.png" alt="The Source is down" style="height: 33px;"></a></li>
<li style="margin-top: 32px;"><a href="https://facebook.com" target="_2"><img src="pics/Facebook.png" alt="The Source is down" style="height: 29px;"></a></li>
</ul>
</div>
</div>
<p class="home_title"><span style="font-size: 40px;">C</span>ontact <span style="font-size: 40px;">U</span>s</p>
<form action="" class="contact_form">
<input type="text" class="input_fields" pattern=".{8,}" required placeholder="Full Name" id="fullname"/>
<input type="email" class="input_fields" required pattern=".{13,}" placeholder="Your Email"/>
<input type="text/number" pattern=".{10,10}" class="input_fields" required placeholder="Phone number (+91)"/>
<select class="dropdown" id="dropdown" onchange="setValue(this.value, 'h1')" >
<option value="feedback">Feedback</option>
<option value="review">Review</option>
<option value="query">Query</option>
<option value="complain">Complaint</option>
<option value="custom">Custom</option>
</select>
<textarea class="text_area" cols="39" rows="8" minlength="50" maxlength="350" required placeholder="Your Review"></textarea>
<input type="submit" class="submit_button" id="submit_button"/>
</form>
<h1 id="h1"></h1>
<h1 id="h2"></h1>
</body>
</html>而不是
<input type="text/number" pattern=".{10,10}" class="input_fields" required placeholder="Phone number (+91)"/>
您可以使用仅接受数字输入的type="number"。
<input type="number" pattern=".{10,10}" class="input_fields" required placeholder="Phone number (+91)"/>