У меня есть текстовые поля, которые отображаются/скрыты в меню выбора. Когда это происходит, скрипт, который контролирует значения текстовых полей для изменений, не срабатывает правильно. По какой-то причине он не замечает изменения.

сценарий:

var somethingChanged = false;
$(document).ready(function(){
    $('input, select').change(function() { 
        somethingChanged = true; 
        console.log($(this).attr('name')+ ' has changed'); 

$('input[class*=input]').focus(function () {
    if ($(this).hasClass('left')) {
    $(this).parent().addClass("lightOverlay");
    console.log($(this).attr('name')+ ' added lightOverlay'); 
    }
}).blur(function () {
    if (this.value == ''){
        $(this).parent().removeClass('lightOverlay')
        console.log($(this).attr('name')+ ' removed lightOverlay'); 
    }
})

$('input[class*=input]').focus(function () {
    if ($(this).hasClass('right')) {
    $(this).parent().addClass("lightOverlayRight");
    console.log($(this).attr('name')+ ' added lightOverlayRight'); 
    }
}).blur(function () {
    if (this.value == ''){
        $(this).parent().removeClass('lightOverlayRight')
    console.log($(this).attr('name')+ ' removed lightOverlayRight'); 
    }
})
})
}); 

Как я могу выполнить этот код при изменении меню выбора?

вот сайт, о котором идет речь, с полным кодом: http://2plygraphics.com/im-here/

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

Я хотел бы изменить его на что-то вроде этого (в основном обернуть все это функцией, вызываемой при нажатии на меню выбора):

var somethingChanged = false;
$(document).ready(function(){

    $('select').click (function () {
    $('input, select').change(function() { 
        somethingChanged = true; 
        console.log($(this).attr('name')+ ' has changed'); 

$('input[class*=input]').focus(function () {
    if ($(this).hasClass('left')) {
    $(this).parent().addClass("lightOverlay");
    console.log($(this).attr('name')+ ' added lightOverlay'); 
    }
}).blur(function () {
    if (this.value == ''){
        $(this).parent().removeClass('lightOverlay')
        console.log($(this).attr('name')+ ' removed lightOverlay'); 
    }
})

$('input[class*=input]').focus(function () {
    if ($(this).hasClass('right')) {
    $(this).parent().addClass("lightOverlayRight");
    console.log($(this).attr('name')+ ' added lightOverlayRight'); 
    }
}).blur(function () {
    if (this.value == ''){
        $(this).parent().removeClass('lightOverlayRight')
    console.log($(this).attr('name')+ ' removed lightOverlayRight'); 
    }
})
})
    });
}); 

но это, похоже, не работает.... Noob центральная здесь !!! пожалуйста помоги!