当指针在图标上时，为什么这个按钮不能正常工作？

Question

当指针位于图标的图像区域内时，它将不起作用，并将其发送到null。但是如果指针在图标旁边并且在按钮内部，它就已经可以工作了。为什么？

这个按钮很完美，但是当你点击按钮中间的图标时，它会像这样提交：

​

​

但是它应该看起来像这样：

​

​

.searchButton2 {
    max-width: 130px;
    width: 50px;
    height: 45px;
    border: 3px solid red;
    background: #28b9ed;
    text-align: center;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    margin-left: 45px;
    margin-top: 45px;
    outline: none;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<button type="submit" class="searchButton2" style="outline:none;" id="google-search" name="google-search"  data-toggle="tooltip" data-placement="top" title="Pesquisa Adprizes+" formaction="https://www.google.com/search?q=adprizes%2B+"><i class="fa fa-search fa-lg"></i></button>

​

<button type="submit" class="searchButton2" style="outline:none;" id="google-search" name="google-search"  data-toggle="tooltip" data-placement="top" title="Pesquisa Adprizes+" formaction="https://www.google.com/search?q=adprizes%2B+"><i class="fa fa-search fa-lg"></i></button>

Answer 1

对我来说，当我添加'form‘标签时，它就会起作用。然而，我确实得到了跨域错误，这是一个完全不同的故事。( https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors )

​

.searchButton2 {
    max-width: 130px;
    width: 50px;
    height: 45px;
    border: 3px solid red;
    background: #28b9ed;
    text-align: center;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    margin-left: 45px;
    margin-top: 45px;
    outline: none;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<form>
<button type="submit" class="searchButton2" style="outline:none;" id="google-search" name="google-search"  data-toggle="tooltip" data-placement="top" title="Pesquisa Adprizes+" formaction="https://www.google.com/search?q=adprizes%2B+"><i class="fa fa-search fa-lg"></i></button>
</form>

​