JS удалить только сообщение по умолчанию по клику, а не текстовые пользовательские вводы - PullRequest
0 голосов
/ 05 марта 2011

днем ​​все,

Нуждаюсь в технических советах от мастеров ... Мне известна функция удаления сообщения по умолчанию при клике из формы, но проблема заключается в том, что после того, как пользователь изначально щелкнул в области сообщений (удалить по умолчанию), если они снова щелкают в области сообщений, это удаляет то, что они написали !! Я думаю, что примером может быть, если они заметили орфографическую ошибку или им нужно изменить часть своего сообщения.

Должен быть способ решить эту проблему?

Код для текстовой области:

<textarea name="message" id="message" rows="9" cols="55" tabindex="9"   onclick="this.value=''">
  <?php if(isset($error)) {echo $message;} else {echo "Please use this area for any other information about your enquiry";}?>
</textarea>

Ответы [ 5 ]

1 голос
/ 14 июля 2011

простой рабочий скрипт

<textarea name="message" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;">
Put anything for default value here
</textarea>

только что выучил несколько минут назад X)

Живой пример: http://jsfiddle.net/SRYLg/

1 голос
/ 05 марта 2011

То, что вы вероятно хотите, это так, верно?

  • Когда страница загружается в первый раз и нет предоставленного пользователем значения, отображается сообщение «Пожалуйста, используйте».
  • Когда текстовая область получает фокус, сообщение «Пожалуйста, используйте» должно исчезнуть.(Возможно, вы хотите подождать, пока что-то наберется; что угодно.)
  • Когда текстовое поле теряет фокус , если пользователь оставил пустое <textarea>, тогда появляется сообщение «Пожалуйста, используйте»должен вернуться.
  • Когда форма отправлена, необходимо проверить, является ли <textarea> пустым (с сообщением «Пожалуйста, используйте») и, если это так, отключить его или очистить значение.

Я бы хотел, чтобы обработчики «focus» и «blur» поддерживали индикатор состояния для явного отслеживания состояния элемента вместо того, чтобы полагаться на сравнение текста с вашим «Please use».сообщениеТо, как вы это сделаете, будет зависеть от того, как вы пишете обработчики событий в целом, но это может выглядеть так:

function setupTextareaHandlers() {
  var txta = document.getElementById("yourTextArea");
  var empty = !txta.value;
  txta.onfocus = function() {
    if (empty) txta.value = '';
  };
  txta.onblur = function() {
    if (!txta.value) {
      empty = true;
      txta.value = 'Please use ... ';
    }
  };
}

Возможно, вы также настроили бы там свой обработчик отправки.

1 голос
/ 05 марта 2011

После первого клика по клику вам нужно удалить атрибут onclick из текстовой области, используя что-то вроде этого:

document.getElementById('message').onclick = null;

Вы можете изменить клик для вызова функции, которая выполняет this.value = '', а затем удаляет клик.

Edit:

<textarea name="message" id="message" rows="9" cols="55" tabindex="9"   onclick="removeDefaultText(this)">
  <?php if(isset($error)) {echo $message;} else {echo "Please use this area for any other information about your enquiry";}?>
</textarea>

<script type="text/javascript">
function removeDefaultText(el){
  el.value='';
  el.onclick=null;
}
</script>
0 голосов
/ 05 марта 2011

Вот jsfiddle

HTML:

<textarea name="message" id="message" rows="9" cols="55" tabindex="9">default message</textarea>

JavaScript-место в теге <head>:

<script type="text/javascript">
    var defaultMsg = document.getElementById("message").value;

    function init() {
        var mytextarea = document.getElementById('message');

        mytextarea.onblur = function() {
            if (this.value == '') this.value = defaultMsg;
        }

        mytextarea.onfocus = function() {
            if (this.value == defaultMsg) this.value = '';
        }
    }

    window.onload = init;
</script>
0 голосов
/ 05 марта 2011

попробуйте

<textarea name="message" id="message" rows="9" cols="55" tabindex="9"     onclick="javascript:if(this.value='default.value') this.value =''">
  <?php if(isset($error)) {echo $message;} else {echo "Please use this area for any other information about your enquiry";}?>
</textarea>
...