2013-02-11 52 views
4

我使用Javascript和jquery mobile创建了8个拼图盒游戏。我用<input readonly></input>做了盒子,我把它们都放在9x9的桌子上。问题是,当我点击一个框来移动它时,即使它是只读的,移动设备也会尝试写入并显示键盘。这不是我想要的...我想禁用输入或使用与<input>不同的东西。我尝试使用禁用=“禁用”,但仍然无法正常工作。 这是代码:在html中禁用输入

<form name="box"> 
    </center> 
    <table align="center"> 
     <tr> 
      <td ><input name="casella1" value="8" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella2" value="5" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella3" value="2" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
     </tr> 
     <tr> 
      <td ><input name="casella4" value="6" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella5" value="3" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella6" value="4" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
     </tr> 
     <tr> 
      <td ><input name="casella7" value="1" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella8" value="7" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 
      <td ><input name="casella9" value="" onClick="test(this.value)" readonly style="text-align: center; width:50px; height:50px; font-weight:bold; background-color: #C0C0C0; border-style: solid; border-color: black"></td> 

     </tr> 
    </table> 
    </form>  

回答

11

您应该使用disabled="disabled"代替disable="disable"

+0

不,这是我在这里写的一个拼写错误,但是我在代码中写了disabled =“disabled”!它不工作,因为JavaScript代码没有执行(onClick被禁用),移动设备仍然显示kyboard!没有另一种方式? – Malo 2013-02-11 17:20:29

3
$("input").attr("disabled","true"); 

是jQuery解决方案,在标记中设置disabled是html解决方案。

3

如果您使用的是HTML5,那么包含disabled属性就足够了,因为它是布尔属性。