Javascript 提交按钮不存在';不行!单击它不会';甚至连console.log都没有
我正在用tailwind css制作一个登录页,但是submit按钮不起作用。我试图检查console.log,即使这样也不行 这里是HTML部分Javascript 提交按钮不存在';不行!单击它不会';甚至连console.log都没有,javascript,html,css,console.log,tailwind-css,Javascript,Html,Css,Console.log,Tailwind Css,我正在用tailwind css制作一个登录页,但是submit按钮不起作用。我试图检查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">
<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>
没有console.log或错误,什么都没有
更新:谢谢,收到了!将更改为您将不得不使用表单标记而不是节 我可以看出身份证是错的
通过查看html模板,应该是联系人。查看此代码段:
document.addEventListener('DOMContentLoaded',(事件)=>{
document.getElementById('contact-form')。addEventListener('submit',submitForm);
函数提交形式(e){
e、 预防默认值();
console.log('123');
}
});代码>
联系我们
有任何反馈和问题,请继续
让我们谈谈
s没有submit
事件。将单击处理程序附加到按钮,而不是表单在哪里?…或将其改为。将id添加到“提交”按钮,然后重试。此外,请确保正确拼写id。您发布的事件侦听器具有未定义的id。抱歉。我最后的评论是错误的。您需要添加一个表单标记并在事件侦听器中使用该id。这会破坏设计。我试过了,已经看到了设计的突破。谢谢,终于把div改成了form!❤️
document.getElementById('Contact').addEventListener('submit', submitForm);
function submitForm(e){
e.preventDefault();
console.log(123)
}