按钮在 IE 11 中不起作用答案

【问题标题】：button won't work in IE 11按钮在 IE 11 中不起作用
【发布时间】：2016-08-23 12:59:03
【问题描述】：

我的表单上的按钮在 IE 11 中不起作用。

您可以在 brandinfluencegroup.com/test 查看该页面

我已经根据这个脚本http://www.html-form-guide.com/contact-form/contact-form-attachment.html创建了表单

它还对文件字段使用样式，我使用了我在这里找到的建议之一Twitter Bootstrap Form File Element upload button

我的代码如下：

<?PHP
require_once("./include/fgcontactform.php");

$formproc = new FGContactForm();

$formproc->AddRecipient('email@email.com.au'); //<<---Put your email address here

$formproc->SetFormRandomKey('HG9hPBpn9Bn26yg');

$formproc->AddFileUploadField('file','pdf,doc,pages,jpg,jpeg,gif,png,bmp',6024);

if(isset($_POST['submitted']))
{
   if($formproc->ProcessForm())
   {
        $formproc->RedirectToURL("thank-you.php");
   }
}

?>
<!doctype html>
<html class="no-js" lang="en">
<head>

<!-- ========== PAGE TITLE ========== -->
<title>BIG | Brand Influence Group</title>

<!-- ========== META TAGS ========== -->
<meta name="description" content="Brand Influence Group - BIG on you">
<meta name="keywords" content="BIG, brand, influence, group">
<meta charset="utf-8">
<meta name="author" content="ThemesEase">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<!-- ========== VIEWPORT META ========== -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />

<!-- ========== FAVICON & APPLE ICONS ========== -->
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">

<!-- ========== GOOGLE FONTS ========== -->
<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:400,300,100" rel='stylesheet' type='text/css'>
<link rel='stylesheet' href='//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' type='text/css'>

<!-- ========== MINIFIED VENDOR CSS ========== -->

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="dist/css/bootstrap-select.css">
<link rel="stylesheet" href="styles/vendor.css">
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="styles/custom.css">

<!-- ========== MODERNIZR ========== -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="dist/js/bootstrap-select.js"></script>
<script type='text/javascript' src='scripts/gen_validatorv31.js'></script>
<script type='text/javascript' src='scripts/fg_captcha_validator.js'></script>
</head>

<body class="dark-header animation">
<form class="notify-div" id='contactus' action='<?php echo $formproc->GetSelfScript(); ?>' method='post' enctype="multipart/form-data" accept-charset='UTF-8'>
  <input type='hidden' name='submitted' id='submitted' value='1'/>
  <input type='hidden' name='<?php echo $formproc->GetFormIDInputName(); ?>' value='<?php echo $formproc->GetFormIDInputValue(); ?>'/>
  <input type='text'  class='spmhidip' name='<?php echo $formproc->GetSpamTrapInputName(); ?>' />
  <div><span class='error'><?php echo $formproc->GetErrorMessage(); ?></span><span id='contactus_name_errorloc' class='error'></span><span id='contactus_email_errorloc' class='error'></span></div>
  <input type="text" name="name" placeholder="Name"/>
  <input type="email" name="email" placeholder="Enter your email"/>
  <select name="message" class="selectpicker" data-hide-disabled="true" data-size="10">
    <option selected value="I want to...">I want to...</option>
    <option value="Apply for a position in Brand Activation">Apply for a position in Brand Activation</option>
    <option value="Apply for a position as Influencer">Apply for a position as Influencer</option>
    <option value="Apply for a position as Account Executive">Apply for a position as Account Executive</option>
    <option value="Apply for a position as Account Manager">Apply for a position as Account Manager</option>
    <option value="Apply for a position as Accountant">Apply for a position as Accountant</option>
    <option value="Apply for a position as Weekend warrior">Apply for a position as Weekend warrior</option>
    <option value="Apply for a position as Cricket Coach">Apply for a position as Cricket Coach</option>
    <option value="Apply for a position as Intern">Apply for a position as Intern</option>
    <option value="Other...">Other...</option>
  </select>
  </span><span><input class="btn btn-primary" type="button" value="Upload your cv..." onclick="$(this).parent().find('input[type=file]').click();"/>
  <input  type="file"  name="file" id="file" style="visibility:hidden; width: 1px;" onchange="$(this).parent().find('span').html($(this).val().replace('C:\\fakepath\\', ''))"  />
  <span  class="badge badge-important" ></span></span>
  <button type="image" class="sr-btn white-btn" id="submit" name="submit" value="Send"><span class="bold">Say</span> <span class="italic">hello</span></button>
</form>
<script type='text/javascript'>
// <![CDATA[

    var frmvalidator  = new Validator("contactus");
    frmvalidator.EnableOnPageErrorDisplay();
    frmvalidator.EnableMsgsTogether();
    frmvalidator.addValidation("name","req","Please provide your name");

    frmvalidator.addValidation("email","req","Please provide your email address");

    frmvalidator.addValidation("email","email","Please provide a valid email address");

    frmvalidator.addValidation("message","maxlen=6048","The message is too long!(more than 2KB!)");

    frmvalidator.addValidation("file","file_extn=jpg;jpeg;gif;png;bmp","Upload images only. Supported file types are: jpg,gif,png,bmp");
// ]]>
</script> <br/>
<br/>
</div>
</div>
</div>
<!-- end row -->

</div>
<!-- end container -->
</section>
<!-- end section --> 

<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. --> 
<script>
            // (function(b, o, i, l, e, r) {
            //  b.GoogleAnalyticsObject = l;
            //  b[l] || (b[l] =
            //      function() {
            //          (b[l].q = b[l].q || []).push(arguments)
            //      });
            //  b[l].l = +new Date;
            //  e = o.createElement(i);
            //  r = o.getElementsByTagName(i)[0];
            //  e.src = 'https://www.google-analytics.com/analytics.js';
            //  r.parentNode.insertBefore(e, r)
            // }(window, document, 'script', 'ga'));
            // ga('create', 'UA-XXXXX-X');
            // ga('send', 'pageview');
        </script> 
<script src="scripts/vendor.js"></script> 
<script src="scripts/main.js"></script>
</body>
</html>

【问题讨论】：

触发哪些事件处理程序？您可以通过在每个处理程序中写入控制台来检查。
感谢您的回复！我想我需要更多这方面的经验。我对javascript不是很有经验，主要是HTML和CSS。你的意思是在 IE 中测试时？
是的，在 IE 中测试时。
示例：onclick="console.log('click'); $(this).parent().find('input[type=file]').click();"和 onchange="console.log('change'); $(this).parent().find('span').html($(this).val().replace('C:\\fakepath\\ ', ''))"

标签： forms internet-explorer button submit formmail

【解决方案1】：

这很可能是因为 Internet Explorer 阻止了 ActiveX 控件，只要我打开 Internet Explorer，它就会显示一个栏：

如果我不按任何按钮，那么按钮将不起作用，并且该条消息也会在 1 或 2 分钟后消失，因此一段时间后您可能不会注意到该消息在开始时就在那里。

另外，我认为这是因为您在本地工作，如果该站点位于受信任的域中，则不应该发生这种情况。

希望这会有所帮助，狮子座。

【讨论】：

嗨！感谢您花时间对此进行测试并回答我的问题！问题发生在测试服务器上，如果你去brandinfluencegroup.com/test 你会明白我的意思......
嗨 Steph，我已经进入该页面，输入文件按钮在 Internet Explorer 11 和 Internet Explorer 10 中工作正常，问题是当您单击它时，没有任何反应，文件资源管理器也没有不出现对吗？如果是这种情况，我强烈建议检查是否启用了 ActiveX 控件，如果你启用了这些，我想不出可能导致这种情况的另一件事，你也应该在另一台计算机上测试它以了解我的意思.狮子座。
再次感谢您的回复！我的客户出现这种情况，我需要告诉他们更改浏览器设置吗？
如果是这样，有没有比我这样做更好的解决方案，因为我想我们不能总是期望用户拥有正确的浏览器设置？
对不起，我刚刚重新阅读了您的消息，不，不是文件资源管理器，而是提交按钮对客户端不起作用。文件上传似乎可以工作，但单击提交按钮时什么也不做......