轻松一个!我只想在电话号码输入字段中输入数字。我如何在简单的js中做到这一点
Posted
技术标签:
【中文标题】轻松一个!我只想在电话号码输入字段中输入数字。我如何在简单的js中做到这一点【英文标题】:Easy one! I want only numbers to be entered in the phone number input field. How do I do that in simple js 【发布时间】:2022-01-01 19:25:30 【问题描述】:在电话号码输入框中只输入数字。代码如下。另外,我希望用户在名称输入框中只输入文本。请帮助使用简单的 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" style="height: 45px;"></a></li>
<li><a href="https://www.instagram.com/navya_malhotra_01/" target="_1"><img src="pics/Instagram.png" style="height: 33px;"></a></li>
<li style="margin-top: 32px;"><a href="https://facebook.com" target="_2"><img src="pics/Facebook.png" 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>
【问题讨论】:
【参考方案1】:代替
<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)"/>
【讨论】:
以上是关于轻松一个!我只想在电话号码输入字段中输入数字。我如何在简单的js中做到这一点的主要内容,如果未能解决你的问题,请参考以下文章