|
|
|
| Добрый вечер.
Вопрос возможно простой но пока не разобрался.
Есть скрипт который чистит поле при фокусе и возвращает текст при blur в обратном случае.
Чтобы не дублировать данный код для множества полей формы подумал сделать функцию куда мы можем передать ID поля и текст который должен возвращаться.
Прошу посмотреть что я не так делаю, вот код который получился:
<script type="text/javascript">
$(document).ready(function(){
$(function my_input_change(input_id,input_txt) {
$(input_id).val(input_txt).focus(function(){
if ($(input_id).val() == input_txt) {
$(input_id).val("");
}
}).blur(function(){
if ($(input_id).val() == "") {
$(input_id).val(input_txt);
}
});
});
});
</script>
<input type="text" value="Какой либо текст id="text_input">
<input type="text" value="Какой либо еще текст id="text_inpu2t">
<input type="text" value="Какой либо еще другой текст id="text_inpu3t">
|
собственно как теперь вызвать эту функцию для нужных мне полей? | |
|
|
|
|
|
|
|
для: ZetRider
(12.03.2012 в 19:53)
| | Я несовсем понял строчку $(function my_input_change) :)
а так реализация вроде бы в правильном направлении )
Вы можете создать необходимую вам функцию в объекте $.fn или jQuery.fn к которой потом вы сможете обращаться из селектора - с помощью стандартного $(selector).your_func()
все просто )
ваша функция - input_change
$.fn.input_change = function(input_txt) {
$(this).focus(function(){
if ($(this).val() == input_txt) {
$(this).val("");
}
}).blur(function(){
if ($(this).val() == "") {
$(this).val(input_txt);
}
});
}
|
Теперь к данной функции можно обращаться из любой коллекции jQuery. Но в вашем случае это текстовые поля
функцию вызывать так:
$("#text_input").input_change("Какой либо текст"); // Это для первого текст. поля
$("#text_input2").input_change("Какой либо еще текст"); // Это для второго текст. поля
|
и т.д.
В КОДЕ ВЫШЕ this в данном случае используется для "текущего объекта".. Т.е. если я вызову функцию так $("#text_input#).input_change("text"); то this это и будет #text_input | |
|
|
|
|
|
|
|
для: ZetRider
(12.03.2012 в 19:53)
| | Если речь идет о значениях по умолчанию (информация пользователю), то не надо никаких функций и что-то передавать в них, тем более в таком виде как вы их объявляете.
<script type="text/javascript">
var def = ['default 1','default 2','default 3'];
$(document).ready(function(){
$("#myfrm input:text").each(function(){
$(this).val(def[$(this).index()]);
});
$("#myfrm input:text").on('focus', function(){
if($(this).val()==def[$(this).index()]) $(this).val('');
}).on('blur', function(){
if(!$.trim($(this).val())) $(this).val(def[$(this).index()]);
});
});
</script>
<form id="myfrm">
<input type="text" />
<input type="text" />
<input type="text" />
</form>
|
Только учитывайте, что установка обработчика события on, это в последних версиях jQuery. | |
|
|
|
|
|
|
|
для: ZetRider
(12.03.2012 в 19:53)
| | Tonik992, спасибо это то, что было нужно и доступно объяснили. Та строчка - это мое не знание синтаксиса. Теперь буду знать :)
task, большое спасибо за ответ, учту. | |
|
|
|
|
|
|
|
для: ZetRider
(13.03.2012 в 08:18)
| | Учитывайте, и главное то, что переменные лучше определять где-то в одном месте, а не раскидывать их по элементам формы, или иным. При этом, эти переменные могут быть объявлены объектом, ключами которого могут выступать имена полей формы. В этом случае, при подключении скрипта и загрузки страницы значенями будут заполнены соответствующие имена полей, и править эти значения можно в одном месте, а не прыгать по страницам.
У вас подход неверен, учитывая сказанное вами - "множество полей". | |
|
|
|