如何防止单击时按钮移动?

风暴

我在div中有几个按钮,一旦单击它们将显示一个值。我遇到的问题是:单击一个按钮并显示一个值后,它也会向下移动。我不确定如何防止这种情况的发生。有人可以帮忙吗?这是我创建的示例的链接:http : //codepen.io/anon/pen/eJzROE

<div id="gamebox">
<input type="button" id="one" onclick="clickBtn('one')"/>
<input type="button" id="two" onclick="clickBtn('two')"/>
<input type="button" id="three" onclick="clickBtn('three')"/>
<input type="button" id="four" onclick="clickBtn('four')"/>
<input type="button" id="five" onclick="clickBtn('five')"/>
<input type="button" id="six" onclick="clickBtn('six')"/>
<input type="button" id="seven" onclick="clickBtn('seven')"/>
<input type="button" id="eight" onclick="clickBtn('eight')"/>
<input type="button" id="nine" onclick="clickBtn('nine')"/>
</div>
#gamebox
{
height:460px;
width:460px;
border:2px solid red;
}
input
{
width:150px;
height:150px;
font-size:60px;
}
var player= 1;
function clickBtn(btn){
if(player == 1){
document.getElementById(btn).value = "X";
document.getElementById(btn).disabled = "disabled";
player -=1;
}
else {
document.getElementById(btn).value = "O";
document.getElementById(btn).disabled = "disabled";
player +=1;
}
}
阿克塞尔

对CSS输入定义进行一些细微调整将有助于将尺寸强制为特定高度。

input
{
  background: white;
  border: 1px solid #DDD;
  height: 50px;
  float: left;
  display: block;
  font-size: 14px;
  width: 150px;
}

更新的示例:http : //codepen.io/anon/pen/qbNjXg

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何防止单击时按钮移动?

来自分类Dev

单击按钮时如何防止表单提交?

来自分类Dev

单击按钮时如何防止表单提交?

来自分类Dev

单击登录按钮时如何防止页面下移?

来自分类Dev

单击登录按钮时如何防止页面下移?

来自分类Dev

AspxGridView,单击更新按钮时如何防止更新?

来自分类Dev

每次单击按钮时如何移动画布对象?

来自分类Dev

单击<a href=> </a>时,防止屏幕移动

来自分类Dev

当Firefox中的按钮处于活动状态时,如何防止按钮文字移动?

来自分类Dev

防止单击按钮时打开引导模态

来自分类Dev

单击按钮时防止div抖动

来自分类Dev

单击按钮时防止Javascript事件

来自分类Dev

防止在单击按钮时关闭XUL notificationBox

来自分类Dev

防止单击按钮时打开VBE

来自分类Dev

移动iOS后单击时按钮消失

来自分类Dev

如何防止快速多次单击表单按钮

来自分类Dev

单击标题中的按钮时,如何防止手风琴切换?

来自分类Dev

当按钮处于焦点状态时,如何防止Enter键触发单击事件

来自分类Dev

蚂蚁设计:如何在单击“折叠”标题但允许按钮时防止扩展?

来自分类Dev

连续第二次单击按钮时如何防止过滤并返回默认结果

来自分类Dev

单击时如何禁用按钮?

来自分类Dev

如何使按钮在单击时消失

来自分类Dev

单击时如何删除按钮?

来自分类Dev

单击上\下\左\右按钮时如何在div中移动圆

来自分类Dev

单击“向上”和“向下”按钮时,如何使边框上下移动?

来自分类Dev

编辑文字时如何防止徽标移动?

来自分类Dev

单击按钮时如何获取按钮的ID?

来自分类Dev

单击按钮时如何更改按钮颜色

来自分类Dev

移动应用程序如何防止当我在此对话框外单击时未关闭确认框

Related 相关文章

  1. 1

    如何防止单击时按钮移动?

  2. 2

    单击按钮时如何防止表单提交?

  3. 3

    单击按钮时如何防止表单提交?

  4. 4

    单击登录按钮时如何防止页面下移?

  5. 5

    单击登录按钮时如何防止页面下移?

  6. 6

    AspxGridView,单击更新按钮时如何防止更新?

  7. 7

    每次单击按钮时如何移动画布对象?

  8. 8

    单击<a href=> </a>时,防止屏幕移动

  9. 9

    当Firefox中的按钮处于活动状态时,如何防止按钮文字移动?

  10. 10

    防止单击按钮时打开引导模态

  11. 11

    单击按钮时防止div抖动

  12. 12

    单击按钮时防止Javascript事件

  13. 13

    防止在单击按钮时关闭XUL notificationBox

  14. 14

    防止单击按钮时打开VBE

  15. 15

    移动iOS后单击时按钮消失

  16. 16

    如何防止快速多次单击表单按钮

  17. 17

    单击标题中的按钮时,如何防止手风琴切换?

  18. 18

    当按钮处于焦点状态时,如何防止Enter键触发单击事件

  19. 19

    蚂蚁设计:如何在单击“折叠”标题但允许按钮时防止扩展?

  20. 20

    连续第二次单击按钮时如何防止过滤并返回默认结果

  21. 21

    单击时如何禁用按钮?

  22. 22

    如何使按钮在单击时消失

  23. 23

    单击时如何删除按钮?

  24. 24

    单击上\下\左\右按钮时如何在div中移动圆

  25. 25

    单击“向上”和“向下”按钮时,如何使边框上下移动?

  26. 26

    编辑文字时如何防止徽标移动?

  27. 27

    单击按钮时如何获取按钮的ID?

  28. 28

    单击按钮时如何更改按钮颜色

  29. 29

    移动应用程序如何防止当我在此对话框外单击时未关闭确认框

热门标签

归档