2016-03-09 3 views
2

Я пытаюсь очистить текстовое поле, и оно не работает. Я получаю предупреждение, но он не очищает его. Что я делаю не так?Пытается использовать JavaScript, чтобы очистить текстовое поле

Это общая функция, которую можно вызвать в любом текстовом поле.

<!DOCTYPE html> 
<html>  
<head> 

    <script type="text/javascript"> 

      function clearThis(target) 
      { 
       alert('before...' + target.value); 

       if ($(target).value == "Search ") 
       { 
        $(target).value = "set to something else"; 
        $(target).style.color = '#000000'; 
        $(target).style.fontStyle = 'italic';  
       } 
       else 
       { 
        $(target).value = ""; 
       } 

       alert('after...' + target.value);    
      }   

    </script>   

    <title>My page</title> 

</head> 

<body> 
    <div class="historysearch"> 
     <input id="username" type="text" value="Search " onclick="clearThis(this)"/>        
    </div> 
</body> 

</html>   
+0

Значение '' Search "' (обратите внимание на дополнительные пробелы), это то, что вы намеревались? – Halcyon

+1

'$ (target)' - объект jquery. Вы должны использовать '$ (target) .val()' для получения и '$ (target) .val (" ")' для установки. Также как '$ (target) .css()' применять стили – Turnip

+0

Как это «не работает»? –

ответ

1

Использование $ хотел бы предложить, что вы используете JQuery, но вы Арент включая библиотеку в вашей странице.

Если вы являются с помощью JQuery, используйте правильный способ JQuery для получения и установки значений (.val()) и стили (.css()). И, конечно же, включают в себя библиотеку JQuery ...

function clearThis(target) { 
 
    alert('before...' + target.value); 
 

 
    if ($(target).val() == "Search ") { 
 
    $(target).val('set to something else'); 
 
    $(target).css({'color':'#000000', 'font-style': 'italic'}) 
 
    } else { 
 
    $(target).val(''); 
 
    } 
 

 
    alert('after...' + target.value); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div class="historysearch"> 
 
    <input id="username" type="text" value="Search " onclick="clearThis(this)" /> 
 
</div>

Если, на самом деле, вы не с помощью JQuery, вам нужно опустить синтаксис $() из кода ..

function clearThis(target) { 
 
    alert('before...' + target.value); 
 

 
    if (target.value == "Search ") { 
 
    target.value = "set to something else"; 
 
    target.style.color = '#000000'; 
 
    target.style.fontStyle = 'italic'; 
 
    } else { 
 
    target.value = ""; 
 
    } 
 

 
    alert('after...' + target.value); 
 
}
<div class="historysearch"> 
 
    <input id="username" type="text" value="Search " onclick="clearThis(this)" /> 
 
</div>

+0

Спасибо .. я смешал 2. – user3020047

0

Пожалуйста, проверьте ниже код

function clearThis(target) 
     { 

      // alert('before...' + target.value); 
      //alert(target); 
      if (target.value == "Search ") 
      { 
       target.value = "set to something else"; 
       target.style.color = '#000000'; 
       target.style.fontStyle = 'italic';  
      } 
      else 
      { 
       target.value = ""; 
      } 
      //alert('after...' + target.value);    
     }   

HTML код

<div class="historysearch"> 
    <input id="username" type="text" value="Search " onclick="clearThis(this)"/>        
</div> 
0

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

<!DOCTYPE html> 
<html>  
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 

    <script type="text/javascript"> 

      function clearThis(target) 
      { 
       if (target.value == "Search ") 
       { 
        $("#username").val("set to something else"); 
       } 
       else 
       { 
        $("#username").val(''); 
       } 

       alert('after...' + target.value);    
      }   

    </script>   

    <title>My page</title> 

</head> 

<body> 
    <div class="historysearch"> 
     <input id="username" type="text" value="Search " onclick="clearThis(this)"/>        
    </div> 
</body> 

</html> 
0

Вы делаете это неправильно.

$(target) является объектом JQuery, а не JS так value не могли быть доступны

Вы можете сделать, как это (JS):

target.value

или

Как это (JQuery) $(target).val()

0

Чтобы очистить значение текстового поля с помощью JQuery, используйте следующую строку:

$ (контроль) .val ("");