0

選択メニューによって表示/非表示になるテキスト フィールドがいくつかあります。これが発生すると、テキスト フィールドの値の変更を監視しているスクリプトが正しく起動しません。何らかの理由で、変化に気付いていません。

脚本:

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中央!!! 助けてください!

4

1 に答える 1