当我的页面有超过 4 个网格时，如何在页面中设置 4 个网格的样式

How to style 4 grids in a page when my pages have more than 4 grids?

本文关键字：网格 设置 样式 我的      更新时间：2023-09-26

我的页面有6个网格，分别称为grid1，grid2，grid3，grid4，grid5，grid6。当我点击搜索按钮时，我读取了网格中的数据，现在我想用样式"color:red"来样式grid1，grid2，grid4，grid5，我可以使用以下代码设置它们的样式：

   #grid1.k-grid-content td {
   color:red 
   } 
   #grid2.k-grid-content td {
   color:red 
   } 
   #grid4.k-grid-content td {
   color:red 
   } 
   #grid5.k-grid-content td {
   color:red 
   }

我认为这种方式真的很复杂和多余，像这样更改代码并单击搜索按钮，但失败了。但是如果我先搜索数据，然后执行更改代码，它就成功了。如何更改我的代码？我只是不想编写复杂和冗余的代码。它可以与jquery"live"事件一起使用吗？有人使用"live"来设计网格td吗？

   .GridColor {
   color:red 
   } 
     $(function () {
    $("#grid1.k-grid-content  td").addClass("GridColor");
    $("#grid2.k-grid-content  td").addClass("GridColor");
    $("#grid4.k-grid-content  td").addClass("GridColor");
    $("#grid5.k-grid-content  td").addClass("GridColor");
     }

试试这个，

$('Search').on("click",function(){
$("#grid1.k-grid-content  td").addClass("GridColor");
    $("#grid2.k-grid-content  td").addClass("GridColor");
    $("#grid4.k-grid-content  td").addClass("GridColor");
    $("#grid5.k-grid-content  td").addClass("GridColor");
});

 .GridColor {
   color:red !important;
   }

 $(function () {
   $("#mybutton").on('click',function(){
 $("[id^='grid']").find('td').addClass("GridColor");
 });
 });

这将查找 ID 以 grid 开头的所有元素，然后定位所有 TD 并添加类

相关文章：