Входная проверка, что пользователь вводил значение между 0-9 Javascript

Я работаю над реализацией головоломки Sudoku.Входная проверка, что пользователь вводил значение между 0-9 Javascript

Первый шаг, который я предпринимаю, заключается в попытке проверить, что то, что вводит пользователь, является значением между 0-9.

Но я застрял в синтаксисе и как решить эту проблему.

<table class="spuzzle"> 
    <caption>Sudoku</caption> 
    <thead> 
    <tr> 
     <th></th> 
     <th>1</th> 
     <th>2</th> 
     <th>3</th> 
     <th>4</th> 
     <th>5</th> 
     <th>6</th> 
     <th>7</th> 
     <th>8</th> 
     <th>9</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <th>A</th> 
     <td colspan="3" rowspan="3" class="greenBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>4</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>3</td> 
      <td>5</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="goldBox"> 
     <table class="subTable"> 
      <tr> 
      <td>5</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>3</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="greenBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>7</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>3</td> 
      <td>1</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>2</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
    </tr> 
    <tr> 
     <th>B</th> 
    </tr> 
    <tr> 
     <th>C</th> 
    </tr> 
    <tr> 
     <th>D</th> 
     <td colspan="3" rowspan="3" class="goldBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>6</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>9</td> 
      </tr> 
      <tr> 
      <td>4</td> 
      <td>7</td> 
      <td>2</td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="greenBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>2</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>9</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="goldBox"> 
     <table class="subTable"> 
      <tr> 
      <td>9</td> 
      <td>3</td> 
      <td>7</td> 
      </tr> 
      <tr> 
      <td>4</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>8</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
    </tr> 
    <tr> 
     <th>E</th> 
    </tr> 
    <tr> 
     <th>F</th> 
    </tr> 
    <tr> 
     <th>G</th> 
     <td colspan="3" rowspan="3" class="greenBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>1</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>4</td> 
      <td>5</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>6</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="goldBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>8</td> 
      <td contentEditable="true"></td> 
      <td>1</td> 
      </tr> 
     </table> 
     </td> 
     <td colspan="3" rowspan="3" class="greenBox"> 
     <table class="subTable"> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td>5</td> 
      <td>2</td> 
      </tr> 
      <tr> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
      <tr> 
      <td>7</td> 
      <td contentEditable="true" class="sudEnter"></td> 
      <td contentEditable="true" class="sudEnter"></td> 
      </tr> 
     </table> 
     </td> 
    </tr> 
    <tr> 
     <th>H</th> 
    </tr> 
    <tr> 
     <th>I</th> 
    </tr> 
    </tbody> 
</table>

Это мой судоку в HTML и здесь является JS У меня есть на данный момент:

function inputCheck() { 
    var userInput = "" 
    userInput = document.getElementsByClassName("sudEnter"); 

    if (userInput > 0) { 
    userInput === userInput; 
    } else if (userInput < 9) { 
    userInput === userInput; 
    } else { 
    document.getElementsByClassName("sudEnter").value = ""; 
    } 
} 

document.addEventListener("keyup", inputCheck);

источник

2015-10-27 RJSims

В вашей, если вы используете ===, которая используется для сравнения переменных. Вы в основном сравниваете userInput с userInput. Просто используйте один = хотя вам не нужно ничего делать, если.

источник

2015-10-27 00:52:37 Justice

Попробуйте заменить input type="number" элемент с атрибутом min установлен в 0, max атрибут установлен в 9 для td элемент

$("input").change(function() { 
 
    if (this.value > this.max) { 
 
    this.value = this.max 
 
    } 
 
    if (this.value < this.min) { 
 
    this.value = this.min 
 
    } 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> 
 
</script> 
 
<input type="number" min="0" max="9" value="0" />

источник

2015-10-27 01:26:07 guest271314

Входная проверка, что пользователь вводил значение между 0-9 Javascript

ответ

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