javascript - 提交按钮不起作用!点击它甚至没有console.log
问题描述
我正在使用顺风 css 制作登录页面,但提交按钮不起作用。我试图检查console.log,即使那不起作用!
这是HTML部分
<section id="Contacts" class="text-shark-100 bg-shark-500 body-font relative">
<div class="container px-5 pt-24 pb-15 mx-auto">
<div class="flex flex-col text-center w-full mb-12">
<h1 class="sm:text-3xl text-2xl font-medium title-font mb-4 text-white">Contact Us</h1>
<p class="lg:w-2/3 mx-auto leading-relaxed text-base">Have any Feedbacks & Questions, Just Go Ahead!</p>
</div>
<div class="lg:w-1/2 md:w-2/3 mx-auto">
<div class="flex flex-wrap -m-2" id="Contact">
<div class="p-2 w-1/2">
<input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="First Name" id="FirstName" type="text">
</div>
<div class="p-2 w-1/2">
<input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Last Name" id="LastName" type="text">
</div>
<div class="p-2 w-full">
<input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Company" id="Company" type="Text">
</div>
<div class="p-2 w-full">
<input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Email" id="Email" type="email">
</div>
<div class="p-2 w-full">
<input class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none focus:border-red-500 text-base px-4 py-2" placeholder="Phone Number" id="PhoneNumber" type="tel">
</div>
<div class="p-2 w-full">
<textarea class="w-full bg-shark-400 rounded border border-shark-300 text-white focus:outline-none h-48 focus:border-red-500 text-base px-4 py-2 resize-none block" placeholder="Message" id="Message"></textarea>
</div>
<div class="p-2 w-full"><!-- Trouble of the button -->
<button class="flex mx-auto text-white bg-red-500 border-0 py-2 px-8 focus:outline-none hover:bg-red-600 hover:shadow-2xl rounded text-lg" type="submit">Let's Talk</button>
</div>
<div class="p-2 w-full pt-8 mt-8 border-t border-shark-300">
</div>
</div>
</div>
</div>
</section>
javascript
document.getElementById('Contact').addEventListener('submit', submitForm);
function submitForm(e){
e.preventDefault();
console.log(123)
}
没有 console.log 或错误,什么都没有
更新:谢谢 知道了!更改为
解决方案
You will have to use form tag instead of section.
And I can see the id is wrong.
Should be Contacts by seeing from html template.
推荐阅读
- python - Python:我在为 Instagram 创建机器人时遇到错误,我该如何解决?
- ios - 使用 Swift 在 Firebase 中进行 GeoHash 查询
- excel - Excel VBA AutoFilter 选择过滤器等于 key1 和 key2 最小值的行
- javascript - 如何从后台注入内容脚本
- mysql - 如何重写它以删除选择语句连接?
- matlab - 无旋转的带状矩阵版本的高斯消元法
- apache-spark - Databricks 光子与催化剂优化器
- r - Apply a req statement to multiple outputs
- reactjs - Eslint 没有显示警告 - 反应
- powershell - 使用 PowerShell 生成 Azure 存储帐户 SAS 密钥