表单在 Internet Explorer 中消失答案

【问题标题】：Form disappears in Internet Explorer表单在 Internet Explorer 中消失
【发布时间】：2015-07-30 13:03:57
【问题描述】：

我对构建网站非常陌生，即。上周我从零开始自学。我设计了一个主题并通过 cpanel 将其上传到 Wordpress。该网站在 Chrome 中看起来很棒，但在 IE 中缺少我的提交按钮和表单，并且在 Firefox 中所有表格都完全错误。

谁能建议解决这个问题？

这是我的网站：http://bespokecook.co.uk/

网站内容不完整，因为它是针对朋友的新公司。

我真的很感谢任何建议......

<div id="content">
<table id="contactform">
<tr>
<td class="form" ROWSPAN="2">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php the_content(__('(more...)')); ?>
<?php endwhile; else: ?>
<?php _e('oops... Sorry this page cannot be found'); ?></p><?php endif; ?>
<form method="post" action="mailto:katy.wooff@bhwt.co.uk?Subject=Enquiry from bespokecook.co.uk" >
    <input class="contactform" required="required" type="text" name="Your-name" placeholder="Your name*">
    <input class="contactform" required="required" type="text" name="Your-surname" placeholder="Your surname*">
    <input class="contactform" required="required" type="tel" name="Telephone" placeholder="Telephone*">
    <input class="contactform" required="required" type="email" name="Email" placeholder="Email*">
    <div id="scroll-bar"><textarea class="contactform" maxlength="2000" spellcheck="true" name="textarea" rows="15" cols="100" placeholder="Anything else you'd like to tell us?"></textarea></div>
<p>*This field is required</p>
<a href="http://bespokecook.co.uk/contact"><input align="left" value="Send Email" class="submit" type="submit" name="submit" value="SEND US YOUR PLANS"></a>
</td>
</form>
<td class="jim-no" ROWSPAN="2"></td>
<td class="sidebar-1"><a><img class="aligncenter" src="http://bespokecook.co.uk/wp-content/uploads/2015/05/IMG_7454.jpg" alt="" width="100%" /></a></td>
</tr>
<tr>
<td class="sidebar">
<h4>Telephone</h4>
<p>07754 626113</p>
<h4>Email</h4>
<a href="mailto:hello@bespokecook.co.uk?Subject=Enquiry from bespokecook.co.uk" target="_top"<p>hello@bespokecook.co.uk</p></a>
</td>
</tr>
</table>
</div>

【问题讨论】：

您应该发布似乎不适用于所有浏览器的代码
是的！我知道！也无法解决这个问题...
你能把<form>和<input>一起发给提交按钮吗
这是CSS 代码？我的意思是html 代码
那仍然是CSS 也许您的代码没有出现是因为您没有代码？你确实说过你上周才开始。您发布的这段代码不会在网页上输出任何东西，除了外观之外，CSS 用于设置按钮/表单的样式。所以为了有一个表单或按钮，去观看一些HTML5 视频.. 编辑：你更新了正确的代码

标签： wordpress forms firefox html-table submit

【解决方案1】：

首先，我没有看到以 <form> 结尾的标签，除非我只是查看了 10 次。要结束 <form> 使用 </form> 。其次，您的按钮有一个 href，为此，<a href="http://www.example.com/"> <button>Whatever</button> </a> 就是一个例子。从我读到的内容看来，您实际上想要一个 submit button 。为此，您需要学习 PHP if statements ，您应该在表单中包含按钮。该声明将类似于if(isset($_POST['submit'])) 这是一个示例，您将需要它。如果你没有它，它就行不通。它只是用于外观和点击，不会做任何事情。我还注意到你在input 中有两个values 用于submit button 你的value 应该只是submit 你会需要它。如果您想要长文本，请使用 button 。 <button>Button tags</button 。我在评论中发布了它，我也会将它放在答案中。 IE 无法识别placeholder，因此不会显示任何字段。

【讨论】：

@Katy 我现在看到了结尾的</form> 标签。另外忘了提一下，IE 无法识别placeholder，所以它不会显示任何内容。
谢谢大卫，我会消化所有这些，谢谢。在 textarea 之后有一个。目前，提交按钮将所有字段加载到 Outlook 电子邮件中，这并不理想，并且会破坏表单的对象。所以 PHP 是我的下一个挑战。我会进行更改，但仍不确定这是否有助于提交在 IE 中显示。再次感谢:) 编辑：感谢您的额外说明！
你知道我可以用什么让 IE 识别输入吗？
@Katy 试试<input type="submit" id="submit" value="Submit"> 作为您的提交按钮并告诉我是否显示。首先将其提交到您的<form> 之外，看看它是否出现。
是的，明天第一件事！谢谢@大卫

【解决方案2】：

良好的 Web 代码开发的一部分是检查 HTML 标记错误。所以我首先修复你的代码错误；见[Invalid] Markup Validation of bespokecook.co.uk - W3C Markup Validator。 W3C 标记验证器是一个很好的工具。该服务还提供 CSS 验证和其他服务。

在验证报告中向下滚动以查看行号和源代码。您缺少一个 Doctype（它将 IE 的版本抛出到怪癖模式），有重复的 div id，并且缺少结束 </form> 标记。缺少的alt 标记错误很小，不会影响显示。开始修复代码错误并重新验证。

并且，学习使用Firefox（或Firebug）或Chrome或Safari或IE中的开发人员工具，了解如何使用和更改HTML以及CSS并检查Javascript 错误（目前没有）。开发工具对于主题和 Web 开发来说非常宝贵。

【讨论】：