创建一个HTML验证码输入框涉及到几个部分。一个用于显示验证码的图片，一个用于用户输入验证码的输入框，以及一个提交按钮。以下是一个简单的示例。
<!DOCTYPE html>
<html>
<head>
<title>验证码输入框示例</title>
</head>
<body>
<div>
<!-- 显示验证码的图片 -->
<img id="captcha-img" src="https://www.271shop.com/static/image/lazy.gif" class="lazy" original="https://www.271shop.com/static/image/nopic320.png" alt="验证码" onclick="this.src="https://www.271shop.com/static/image/lazy.gif" class="lazy" original="https://www.271shop.com/static/image/nopic320.png" <!-- 用户输入验证码的输入框 -->
<input type="text" id="captcha-input" placeholder="请输入验证码">
<!-- 提交按钮 -->
<button type="button" onclick="submitCaptcha()">提交</button>
</div>
<!-- JavaScript部分用于处理点击事件和提交验证码 -->
<script>
function submitCaptcha() {
// 获取用户输入的验证码和正确的验证码（通常从服务器获取）进行比较
var userCaptcha = document.getElementById(’captcha-input’).value;
var correctCaptcha = // 从服务器或其他地方获取正确的验证码
if (userCaptcha === correctCaptcha) {
alert(’验证码正确’);
} else {
alert(’验证码错误’);
}
}
</script>
</body>
</html>在这个例子中，你需要替换https://www.271shop.com/static/image/nopic320.png 为你的验证码图片的URL，当用户点击图片时，通过添加随机数到URL后面来刷新图片，这样可以防止用户使用缓存的图片，提交按钮会触发submitCaptcha 函数，这个函数会获取用户输入的验证码并与正确的验证码进行比较，这只是一个简单的示例，实际的实现可能需要与服务器交互以验证用户的输入。
真正的验证码系统会更复杂，包括服务器端生成和验证验证码，以防止恶意用户或机器人滥用，为了提高安全性，你可能还需要使用更复杂的验证码系统，如Google的reCAPTCHA服务。
