Question

我有这个页面div#container，其中包含inputbox，textareas和selectboxes。当我点击它们时，我想改变包含div“djform_field”

的背景颜色

#dj-classifieds .dj-additem .djform_row .djform_field:focus {
    background: none repeat scroll 0 0 #F5F5F5;
    border-radius: 5px;
    float: left;
    padding: 15px;
}

<div class="djform_field">
        <textarea id="contact" name="contact" rows="1" cols="55" class="inputbox required"><?php echo $this->item->contact; ?></textarea>     
         <div id="input-tips"><span class="hint"><?php echo JTEXT::_('COM_DJCLASSIFIEDS_CONTACT_TOOLTIP')?><span class="hint-pointer">&nbsp;</span></span></div>             
    </div>
    <div style="clear:both"></div>
</div>

Answer 1

$('#contact').focus(function(){
  $('.djform_field').addClass('red');
}).blur(function(){
 $('.djform_field').removeClass('red');
})

参见demo here（使用jQuery）

Answer 2

$('.djform_field').children('*').click(function () { //use required selector in .children(), * means all children
    $('.djform_field').css('background', 'color');
})

Answer 3

设置一个大型点击处理程序：

$("#container :text, #container select").click(function() {
    $("div.djform_field)".css("background-color", "red"); //or whatever
});

输入框焦点设置样式包含div：背景

3 个答案: