通过单击父项输入文本颜色

Question

$('.title').click(function(){
$(this).addClass('titleact');
});

.title{
background:#eee;
cursor:pointer;
}

.titleact{
background:lightseagreen;
color:white;
}

.title input{
background:none;
border:none;
outline:none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='title'>
<span>abc</span>
<input type='text' value='lorem'>
</div>

如何仅使用css通过单击title来获得白色的输入文字？

lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum

Answer 1

更改

"color:white;" 

到

"color:white !important"

或者更好的方法是添加

".titleact input{ color: white;}" 

到您的CSS。

Answer 2

尝试：

 <script type="text/javascript">
      $('.title').click(function(){
        $(this).addClass('titleact');
        $(this).find("*").css("color","#fff");
        });
    </script>

或

<script type="text/javascript">
  $('.title').click(function(){
    $(this).addClass("titleact");
    $(this).find("*").addClass("titleact");
    });
</script>