Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.08.2015, 16:20
Интересующийся
Отправить личное сообщение для helgajijka Посмотреть профиль Найти все сообщения от helgajijka
 
Регистрация: 23.03.2015
Сообщений: 27

Как отследить событие изменения скрытого input?
Помогите пожалуйста разобраться с таким вопросом:
Есть скрытое поле input, туда заносятся значения по действию пользователя (в данном случаю пользователь выбирает дату на фильтре).

Как можно отследить каждое изменение значения поля input?

Спасибо за ответы
Ответить с цитированием
  #2 (permalink)  
Старый 28.08.2015, 16:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от helgajijka
туда заносятся
это наверно шаман заносит? может шаману бубен дать пусть стучит в бубен когда меняет данные.
хочется самому стучать ищите MutationObserver
Ответить с цитированием
  #3 (permalink)  
Старый 28.08.2015, 16:39
Интересующийся
Отправить личное сообщение для helgajijka Посмотреть профиль Найти все сообщения от helgajijka
 
Регистрация: 23.03.2015
Сообщений: 27

))
Дело в том что там есть уже скрипт, который, добавляет в этот input значение из разных элементов, в частности из select. Вот фрагмент кода:
$('.select-date').change(function () {		
		var val = $(this).val();
		$('#inputHidden').val(val);	 
	});

И теперь в отдельном скрипте нужно отследить изменение значения этого input.
Ну как то так))
Я попробовала вот это решение
var inp = $('#inputHidden'),
    inputValue= inp.val(),
    timer = setInterval(function(){
        if(inp.val() !== inputValue) {
            clearInterval(timer);
            inp.trigger('change');
        }
    }, 100);
 
$('#inputHidden').on('change', function(){
    console.log("changed");
 });


Но это не дает нужного результата, я так понимаю здесь change не подходит.
Может посоветуете какое событие у input нужно использовать?

Последний раз редактировалось helgajijka, 28.08.2015 в 16:44.
Ответить с цитированием
  #4 (permalink)  
Старый 28.08.2015, 17:45
Аватар для join
Профессор
Отправить личное сообщение для join Посмотреть профиль Найти все сообщения от join
 
Регистрация: 05.03.2012
Сообщений: 477

helgajijka,
input
Ответить с цитированием
  #5 (permalink)  
Старый 28.08.2015, 17:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

join,
требуется отследить $.val а не событие
Ответить с цитированием
  #6 (permalink)  
Старый 28.08.2015, 18:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

helgajijka,
вот такие танцы с бубнами можно попробовать
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
 $(function() {
     $(".select-date").change(function() {
         var a = $(this).val();
         $("#inputHidden").val(a)
     });
     $.valHooks.input = {
         get: function(a) {
             return a.value
         },
         set: function(a, b) {
             var c = a.value;
             a.value = b;
             "inputHidden" == a.id && c !== b && $(a).trigger("change")
         }
     };
     $("#inputHidden").on("change", function() {
         alert(this.value)
     })
 });


  </script>
</head>

<body>
   <form action="http://">
  <input id="inputHidden" name="" type="hidden">
  <select class="select-date" name="" size="1">
  <option value="1">1</option>
  <option value="2">2</option>
  </select>
  </form>

</body>

</html>
Ответить с цитированием
  #7 (permalink)  
Старый 29.08.2015, 10:42
Аватар для join
Профессор
Отправить личное сообщение для join Посмотреть профиль Найти все сообщения от join
 
Регистрация: 05.03.2012
Сообщений: 477

Сообщение от рони
требуется отследить $.val а не событие
Верно. Моя невнимательность.

Только не понял что делают эти две строки кода?
"inputHidden" == a.id && c !== b


Вроде никак не влияют на конечный результат.
Ответить с цитированием
  #8 (permalink)  
Старый 29.08.2015, 10:56
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от join
Только не понял что делают эти две строки кода?
"inputHidden" == a.id && c !== b
запускать тригер только для одного элемента и только в том случае если его значение поменялось на иное
Ответить с цитированием
  #9 (permalink)  
Старый 29.08.2015, 11:01
Аватар для join
Профессор
Отправить личное сообщение для join Посмотреть профиль Найти все сообщения от join
 
Регистрация: 05.03.2012
Сообщений: 477

рони,
Ясно. Буду знать.
Ответить с цитированием
  #10 (permalink)  
Старый 29.08.2015, 23:59
Интересующийся
Отправить личное сообщение для helgajijka Посмотреть профиль Найти все сообщения от helgajijka
 
Регистрация: 23.03.2015
Сообщений: 27

Спасибо всем огромное за ответы!

рони,
Отдельное спасибо за решение, действительно это в моем случае работает, хотя лично я не все понимаю в этом коде)) особенно вот эта строка мне совсем не понятна -
"inputHidden" == a.id && c !== b && $(a).trigger("change")

Спасибо еще раз за помощь! Уже не раз Вы меня выручаете)
Благодарю за поддержку!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 13:29
Как сверстать input без картинок greatilya (X)HTML/CSS 26 26.01.2012 16:10
Как отловить обратное событие "click" ? jsuse Общие вопросы Javascript 2 18.01.2012 00:16
как проверить поддеружет браузер определенное событие? GOll Элементы интерфейса 9 24.07.2008 14:40
Разным элементам input - разное форматирование. Как? eclipse (X)HTML/CSS 1 25.10.2007 13:55