jQuery的父母DIV的變化的背景

我在我的html頁面一個下面的代碼片段：jQuery的父母DIV的變化的背景

<div class="inputboximage"> 
    <div class="value2"> 
    <input name='address1' value='Somewhere' type="text" size="26" maxlength="40" /> 
    <br /> 

    </div> 
</div>

我的問題是我需要的inputboximage背景改變，當我在地址1文本字段點擊和回覆當它失去焦點的時候到原始。

我已經使用了以下內容：

<script> 
    $(document).ready(function(){ 

    $("input").focus(function() { 
     $(this.parentNode).css('background-image', 'url(images/curvedinputblue.gif)'); 
    }); 

    $("input").blur(function() { 
    $(this.parentNode).css('background-image', 'url(images/curvedinput.gif)'); 
    }); 

    }); 
    </script>

但不是取代的形象，這似乎是添加背景圖片到值2 DIV如你所願。在這種情況下，我可以使用parentNode.parentNode，但inputboxImage節點也有可能會進一步上下父樹。

有沒有一種方法可以更改此代碼，以便它將導航到父樹，直到它找到一個名爲inputboximage的div並將其替換爲那裏的圖像？另外，如果我有兩個不同的div類，inputboximage和inputboximageLarge，有沒有辦法修改這個函數，這樣它就可以和兩個工作，用不同的圖像替換每個背景圖像？

來源

2008-11-03 Jimoc

我想用

$(this).parents('div.inputBoxImage').css(...)

代替$(this.parentNode)應該工作。

見jQuery的traversing documentation

編輯：更新以下PRODY的回答（改變父母的父母）

來源

2008-11-03 10:55:39

感謝菲爾，這完美的作品。現在我需要做的就是弄清楚如何使它適用於需要相同功能但不同背景圖像的其他元素。 – Jimoc 2008-11-03 11:44:58

我不是100％肯定，但我認爲你需要的是什麼菲爾聖的回答表明，除了使用parents （注意最後一個S）

從jQuery的API：

父（字符串表達式）返回jQuery的獲取一組包含獨特的括號元素ts匹配的元素集合。

父母（字符串表達式）返回的jQuery 獲取一組包含匹配元素集合中的唯一祖先元素（除了根元素）。

來源

2008-11-03 11:03:05 Prody

你死定了。父母（...）只搜索直接父母。我總是設法讓這兩個人感到困惑！ – 2008-11-03 11:06:34

現在，因爲在HTML只有ID都是唯一的，你可以參考的股利直接而不做任何遍歷：

<div class="inputboximage" id="inputboximage"> 
    <div class="value2"> 
    <input name='address1'  value='5 The Laurels' type="text" size="26" maxlength="40" /> 
    <br /> 

    </div> 
</div> 

<script> 
    $(document).ready(function(){ 

    $("input").focus(function() { 
     $('#inputboximage').css('background-image', 'url(images/curvedinputblue.gif)'); 
    }); 


    }); 
</script>

注意的是，雖然它是可以過濾對CSS分級的父元素，使用樣式類DOR行爲是一個壞主意TM，你應該避免這樣做。但如果你是真的絕望了，你可以試試看：

$("input").focus(function() { 
     $(this).parents('div.inputboximage').css('background-image', 'url(images/curvedinputblue.gif)'); 
    });

來源

2008-11-03 11:15:28

.parent（）的CSS（這裏的變化）

來源

2009-01-18 17:22:49 adardesign

jQuery的父母DIV的變化的背景

回答

相關問題