2016-02-28 5 views
-1

Это мой код.Id получает pass.But can not change value. Он показывает значение изменения аннота null. Мне нужно изменить его значение на "X" onclick.Как изменить значение кнопки при нажатии?

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="tictactoe.css" /> 
</head> 
<body> 
    <table cellpadding="0" cellspacing="0"> 
     <tr> 
      <td><input type="button" value=" " class="buttons" id="1" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="2" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="3" onclick="tictactoe(this.id)"></td> 
     </tr> 
     <tr> 
      <td><input type="button" value=" " class="buttons" id="4" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="5" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="6" onclick="tictactoe(this.id)"></td> 
     </tr> 
     <tr> 
      <td><input type="button" value=" " class="buttons" id="7" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="8" onclick="tictactoe(this.id)"></td> 
      <td><input type="button" value=" " class="buttons" id="9" onclick="tictactoe(this.id)"></td> 
     </tr> 
    </table> 
</body> 
<script type="text/javascript"> 
    tictactoe = function(id) { 
    var box = document.getElementById("this.id"); 
    box.value = "X"; 
    } 
</script> 
</html> 
+0

'var box = document.getElementById (passArgument);' Почему кавычки ... Он будет обрабатываться в строке ... – Rayon

ответ

1

попробовать это, надежда будет работать

<script type="text/javascript"> 
tictactoe = function(id) { 
var box = document.getElementById(id); 
box.value = "X"; 
} 

Работа пример here.

0

Как правило, не рекомендуется проводить прослушивание onclick в самом HTML.

Кроме того, убедитесь, что ваши идентификаторы начинаются с букв.

Решение вы ищете может быть сделано следующим образом:

HTML:

<table cellpadding="0" cellspacing="0"> 
    <tr> 
     <td><input type="button" value=" " class="buttons" id="b1"></td> 
     <td><input type="button" value=" " class="buttons" id="b2"></td> 
     <td><input type="button" value=" " class="buttons" id="b3"></td> 
    </tr> 
    <tr> 
     <td><input type="button" value=" " class="buttons" id="b4"></td> 
     <td><input type="button" value=" " class="buttons" id="b5"></td> 
     <td><input type="button" value=" " class="buttons" id="b6"></td> 
    </tr> 
    <tr> 
     <td><input type="button" value=" " class="buttons" id="b7"></td> 
     <td><input type="button" value=" " class="buttons" id="b8"></td> 
     <td><input type="button" value=" " class="buttons" id="b9"></td> 
    </tr> 
</table> 

И ЯШ:

var setButtonListener = function (i) { 
     document.getElementById('b' + i).addEventListener('click', function (e) { 
     var current = i; 
     e.target.setAttribute('value', current); 
     }); 
    }; 
    var i; 
    for (i = 1; i < 10; i++) { 
     setButtonListener(i); 
    } 

Demo

Смежные вопросы