Question

我有这个JavaScript使用下面的表格更改表格上的高亮颜色。默认颜色为绿色，我可以通过单击颜色按钮选择我想要的颜色。此代码仅适用于class="selector"的输入。我希望此功能也适用于class="all"的输入，因此我复制了代码并将$('.selector')更改为=＆gt;第二个副本中的$('.all')。但我无法得到我想要的结果，代码对class="all"选择不起作用。我想要改变颜色，以便选择全部＆＃34;也是。任何想法如何实现这一目标？请。感谢。

小提琴：https://jsfiddle.net/hfh6smf8/

使用Javascript：

$(function () {
  $('.selector').on('click', function(e) {
    var checked = this.name;
    var selectedColor = '';

    if (this.checked) {
      selectedColor = $('#nextColor').val();

      }
    $('td').filter(function() {
      return this.textContent == checked;
    }).css('background-color', selectedColor);
  });
});

HTML表单：

<form id="form1" name="form1" method="post" action="">
    <label><input type="checkbox" name="SelectAll" class="all" />SelectAll</label>
    <label><input type="checkbox" name="M" class="selector" />M</label>
    <label><input type="checkbox" name="n" class="selector" />n</label>
    <label><input type="checkbox" name="nn" class="selector" />nn</label>
    <label><input type="checkbox" name="R" class="selector" />R</label>
</form>

Answer 1

https://jsfiddle.net/hfh6smf8/7/

这是你试图实现的目标吗？如果是的话，如果您已经推出了所有相关的HTML，那将很容易还有，你想检查所有的复选框吗？

$('.all').on('click', function(e) {
    var checked = this.name;
    var selectedColor = '';

    if (this.checked) {
      selectedColor = $('#nextColor').val();

      }
    $('td').css('background-color', selectedColor);
  });

这是为了回答你的另一个问题，你需要知道如何使用selector，它会对你有所帮助，因为这只是可以实现你想做的事情的样本，你可以做它更具体的选择器

https://jsfiddle.net/5z7zbaq2/2/ 改变

$('td').css('background-color', selectedColor);

到

 $('#form1').find('td').css('background-color', selectedColor);

突出显示颜色变化＆＃34;全选＆＃34;

1 个答案: