两个选择与表列

我有一个多列的表。我有两个选择框：两个选择与表列

之一更改突出显示的列的背景颜色
一个选择突出

这是假设我点击#colorselect选择框第一哪一列。我是否需要先用#columnselect选择框创建另一个功能，然后在里面建立#colorselect函数？

这是我到目前为止有：

$(function(){ 
    $("#colorselect").change(function() { 
     $("#colorselect option:selected").each(function() { 
      if($(this).attr("value")=="red") { 
       clr="red" 
      } 

      if($(this).attr("value")=="green") { 
       clr="green" 
      } 

      if($(this).attr("value")=="") { 
       clr="yellow" 
      } 
     }; 

     $("#columnselect").change(function() { 
      $("#columnselect option:selected").each(function() { 
       if($(this).attr("value")=="column1") { 
        columnhighlightsel="Column1" 
       } 

       if($(this).attr("value")=="column2") { 
        columnhighlightsel="Column2" 
       } 

       if($(this).attr("value")=="") { 
        columnhighlightsel="Column2" 
       } 
      } 

      for (var i = 0; i<= $("#table th").length; i++) { 
       if($.trim($("#dailytable th:nth-child("+i+")").text()) === columnhighlightsel) { 
        varcolumnhighlight=i 
       } 
      }; 

      $("#table tbody tr td:nth-child("+columnhighlight+")").each(function() { 
       $(this).css('background-color', clr); 
      };

来源

2014-12-05 highflying

你可以请张贴你的HTML吗？据推测，除非你有一个“默认”列，否则你需要在列颜色变化之前先选择列选择...... – wahwahwah 2014-12-05 17:24:32

没有得到你的问题，但是你应该关闭jQuery变化函数像这样}};而不是像这样}; – 2014-12-05 17:28:21

检查更新后的问题，你严重缺少关闭'}）'问题。 – silentw 2014-12-05 17:30:21

我只想编写处理在任一列的改变单一的功能。在执行代码之前检查是否空白。那么顺序并不重要。

接下来，只要在你的颜色值，选择您想要的颜色和列的列数：根据你的价值观

$('#colorselect, #columnselect').change(function() { 
    var $color = $('#colorselect').val(), 
     $column = $('#columnselect').val(); 
    if ($color && $column) { 
    $("#table tbody tr td:nth-child("+$column+")").each(function(){ 
     $(this).css('background-color', $color); 
    }; 
    } 
});

，您可能需要调整，如果条件更具体。

来源

2014-12-05 17:28:16 noel

谢谢！这非常有帮助。我知道我做得比现在更复杂。 – highflying 2014-12-05 17:59:02

$("#colorselect").change(function(){ 
      clr = $("#colorselect option:selected").attr("value"); 
     clr = clr == '' ? 'yellow' : clr; 
     color(); 
    } 

    $("#columnselect").change(function(){ 

     columnhighlightsel= $(this); 
     color(); 
    } 

function color(){ 
    if(!columnhighlightsel || !clr){ 
     return; 
    } 
    columnhighlightsel.css('background-color', clr); 
}

您现在必须将columnhighlightsel和clr-变量放入颜色函数上下文中。

来源

2014-12-05 17:32:59

两个选择与表列

回答

相关问题