Как сфокусировать текстовое поле html, используя JavaScript? - PullRequest
Новая
       13

Как сфокусировать текстовое поле html, используя JavaScript?

1 голос
/ 02 мая 2011

Привет, ребята, может кто-нибудь сказать мне, как сфокусировать текстовое поле html, используя javascript? Я новичок в программировании и только начинаю учиться. У меня есть код, в котором Я хочу установить курсор в текстовое поле.

test.html 

<html>
<head>
<script type='text/javascript'>
 function parseTest() {
  var elem_1 = document.getElementById('input_1');
  var elem_2 = document.getElementById('input_2');

  var inp_1 = elem_1.value;
  var inp_2 = elem_2.value;

  if (inp_1 == "" && inp_2 == "") {
   alert("You need to enter integers!!!");
   elem_1.focus();
  }else if (inp_1 == ""){
   alert("You need to enter Integer 1!!!");
   elem_1.focus();
  }else if (inp_2 == ""){
   alert("You need to enter Integer 2!!!");
   elem_2.focus();
  }else {
   if (!parseInt(inp_1) || !parseInt(inp_2)) alert ("Enter Integers only!!!");
   else alert("Correct Inputs!!!");
  } 
 }
</script>
</head>

<body>
 <form name="myform">
  <input type="text" id="input_1" name="input_1" /><br />
  <input type="text" id="input_2" name="input_2" /><br />
  <input type="submit" value="Check!" onclick="parseTest();" />
 </form>
</body>
</html>

Я новичок, поэтому будьте терпеливы. Просьба помочь ...

Ответы [ 2 ]

4 голосов
/ 02 мая 2011

Этот код делает это - однако сразу после этого он отправляет форму и повторно отображает страницу, поэтому вы не видите, что фокус происходит.

Просто добавьте return false; к вашему вызову функции в onclick, вот так: 

<input type="submit" value="Check!" onclick="parseTest(); return false;" />
1 голос
/ 02 мая 2011

На самом деле, вы не хотите отправлять после каждого нажатия кнопки.
Вы можете сделать это по-другому:
1. Если вы хотите просто проверить ввод, не заполняя форму: используйте тип ввода «кнопка» 

<input type="button" value="Check!" onclick="parseTest();" />

2. если вы хотите отправить, если все правильно: используйте это так: 

    <html>
    <head>
    <script type='text/javascript'>
     function parseTest() {
      var elem_1 = document.getElementById('input_1');
      var elem_2 = document.getElementById('input_2');

      var inp_1 = elem_1.value;
      var inp_2 = elem_2.value;

      if (inp_1 == "" && inp_2 == "") {
       alert("You need to enter integers!!!");
       elem_1.focus();
      }else if (inp_1 == ""){
       alert("You need to enter Integer 1!!!");
       elem_1.focus();
      }else if (inp_2 == ""){
       alert("You need to enter Integer 2!!!");
       elem_2.focus();
      }else {
       if (!parseInt(inp_1) || !parseInt(inp_2)) alert ("Enter Integers only!!!");
       else 
       {
          alert("Correct Inputs!!!");
          return true;
       }
      } 
      return false;
     }
    </script>
    </head>

    <body>
     <form name="myform">
      <input type="text" id="input_1" name="input_1" /><br />
      <input type="text" id="input_2" name="input_2" /><br />
      <input type="submit" value="Check!" onclick="return parseTest();" />
     </form>
    </body>
    </html>
...