Materialize Button仅在单击某些部件时有效

Question

您好我已经创建了一个带有Materialize的按钮，但它仅适用于按钮的某些区域（主要是文本周围的区域）。有什么理由吗？

在我的表单中，我所做的就是添加另一个输入：

<input name="mySubmit" type="submit" value="Log In!" class="waves-effect waves-light btn" />

但是当我点击按钮时，只有盒装区域才会将其识别为输入：

提前感谢您的帮助！

Answer 1

似乎Materialise将输入标签包装在＆＃34; i＆＃34;标记，然后呈现为一个看起来像按钮的元素，可点击性仅限于文本部分。

我能够通过简单地将输入标签转换为按钮标签来解决这个问题。

初始代码：

<input type="submit" value="List Employees" id="fetch-employees" 
class="waves-effect waves-light btn">

然后在浏览器中呈现的内容：

<i class="waves-effect waves-light btn waves-input-wrapper" style="">
    <input type="submit" value="List Employees" id="fetch-employees" 
    class="waves-button-input">
</i>

解决方案：

<button type="submit" value="List Employees" id="fetch-employees" 
class="waves-effect waves-light btn">List Employees</button>