Question

好吧所以已经有了答案，但我正在尝试做同样的事情，但是我有同样的另一个css类来“调用”这个脚本。

示例：我有这个消息调用，当消息内的内容超过0时，它会改变背景颜色，我想做的是将“.root_panel”的底部边框更改为与消息相同的颜色。我是JavaScript的新手。

脚本：

$(document).ready(function () 
{
   $(".messagess").each(function() 
    {
      var el = $(this);
      var value = parseFloat(el.text());
      if (value > 0) 
         {
            el.css("background","#6E8A75").css("color","#fff");
         }
      else
         {
            el.css("color", "#fff"); 
         }
    }); 
});

Answer 1

请将我的答案作为参考，希望对此有所帮助。

$(document).ready(function(){
  $("button").click(function(){
    if($("#zero").val() <= 0){
      $(".root_panel").css({ 'border-bottom' : '2px solid red' });
    }else if($("#zero").val() === "1"){
      $(".root_panel").css({ 'border-bottom' : '2px solid blue' });
    }else if($("#zero").val() === "2"){
      $(".root_panel").css({ 'border-bottom' : '2px solid green' });
    }else if($("#zero").val() === "3"){
      $(".root_panel").css({ 'border-bottom' : '2px solid violet' });
    }else if($("#zero").val() === "4"){
      $(".root_panel").css({ 'border-bottom' : '2px solid pink' });
    }else if($("#zero").val() === "5"){
      $(".root_panel").css({ 'border-bottom' : '2px solid gray' });
    }else if($("#zero").val() === "6"){
      $(".root_panel").css({ 'border-bottom' : '2px solid black' });
    }else if($("#zero").val() === "7"){
      $(".root_panel").css({ 'border-bottom' : '2px solid orange' });
    }else{
      $(".root_panel").css({ 'border-bottom' : 'none' });
    } 
    
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div class="root_panel" style="overflow: auto;">root panel</div>


<button>button</button>
<input type="text" id="zero" />

jQuery如果value大于1，如何更改CSS

1 个答案: