Отключить текстовые поля - PullRequest
1 голос
/ 11 мая 2009

Я новичок в HTML. У меня есть два текстовых поля, скажем, t1 и t2. Если t1 заполнен некоторыми данными, то другое текстовое поле t2 должно быть отключено. Пожалуйста, дайте мне знать, чтобы сделать это. Заранее спасибо

Ответы [ 3 ]

2 голосов
/ 11 мая 2009

Основываясь на вашем простом описании сценария, вот реализация, которая работает в кросс-браузерном режиме и без какой-либо сторонней библиотеки JavaScript:

<html>
<head>
<script type="text/javascript">
window.onload = function(){
  var t1 = document.getElementById("t1");
  var t2 = document.getElementById("t2");
  t1.onchange = function(){
     t2.disabled = t1.value.length > 0;
  }
}
</script>
</head>
<body>
<form>
t1:<input type="text" id="t1" name="t1" /><br/>
t2:<input type="text" id="t2" name="t2" />
</form>
</body>
</html>
0 голосов
/ 11 мая 2009
<head>
<script type="text/javascript">
  function verify(){
    var t1 = document.getElementById ('first');
    var t2 = document.getElementById ('second');
    if (t1.value != '') {
       t2.setAttribute('disabled','disabled');
       return true; 
    } 
    if (t2.value != '') {
       t1.setAttribute('disabled','disabled');
       return true;
    }
  }
</script>
</head>
<body>
...
<input type="text" id="first" onblur="verify()">
<input type="text" id="second" onblur="verify()">
...
</body>
0 голосов
/ 11 мая 2009

Этого нельзя достичь с помощью простого HTML.

Следуя рекомендациям прогрессивное улучшение , вы должны сначала выполнить проверку на стороне сервера в любом обработчике форм, который вы используете для обработки отправленных данных.

Тогда вы можете рассмотреть возможность добавления JavaScript для проверки на стороне клиента. Что-то вроде:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>Disabling form controls</title>
    </head>
    <body>
        <form id="myForm" action="http://example.com/">
          <div>
            <input name="t1">
            <input name="t2">
          </div>
        </form>
        <script type="text/javascript">
        (function () {
          var t1 = document.forms.myForm.elements.t1;
          var t2 = document.forms.myForm.elements.t2;
          var handler = function handler() {
            t2.disabled = (t1.value !== "");
          };
          t1.onchange = handler;
        }());
        </script>
    </body>
</html>

(хотя я бы использовал библиотеку, такую ​​как YUI или jQuery , чтобы добавить обработчики событий способом, который лучше защищен от перезаписи совместимым с кросс-браузером способом).

Возможно, вам понадобятся учебники по JavaScript и DOM , чтобы это имело смысл.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...