我的按钮内的文本可以在HTML中编辑。为什么？

Question

我创建了一个具有Login和Cancel按钮的基本HTML页面，但是每当我点击按钮时，它都允许我编辑按钮本身的文本。我检查了编码，看起来很好。经过研究，我只能得到关于如何编辑字段等文本的结果。我该如何解决这个问题？

这里是我用来创建按钮HTML代码：

<input class="button" onclick="check(this.form)" value="Login"><br /><br /> 
    <input class="button" name="cancel" value="Cancel"> 

这里是我使用的CSS按钮的类：

.button { 
    display: inline-block; 
    text-align: center; 
    vertical-align: middle; 
    padding: 14px 62px; 
    border: 0px solid #2b27a1; 
    border-radius: 35px; 
    background: #2525f5; 
    background: -webkit-gradient(linear, left top, left bottom, from(#2525f5), to(#000326)); 
    background: -moz-linear-gradient(top, #2525f5, #000326); 
    background: linear-gradient(to bottom, #2525f5, #000326); 
    text-shadow: #591717 1px 1px 1px; 
    font: normal normal bold 20px verdana; 
    color: #ffffff; 
    text-decoration: none; 

} 
.button:hover, 
.button:focus { 
    border: 0px solid #453eff; 
    background: #2c2cff; 
    background: -webkit-gradient(linear, left top, left bottom, from(#2c2cff), to(#00042e)); 
    background: -moz-linear-gradient(top, #2c2cff, #00042e); 
    background: linear-gradient(to bottom, #2c2cff, #00042e); 
    color: #ffffff; 
    text-decoration: none; 
} 
.button:active { 
    background: #161693; 
    background: -webkit-gradient(linear, left top, left bottom, from(#161693), to(#000326)); 
    background: -moz-linear-gradient(top, #161693, #000326); 
    background: linear-gradient(to bottom, #161693, #000326); 
} 

Answer 1

你忘了申报type of button这样的：

input type = "button"

的默认type对于input是text（文本字段）。