Jquery 更改 CSS 变量 div

Jquery Change CSS of variable div

我有一个 table 和一堆 td 和 类 markTD,它们每个都有一个不同的整数属性 value。我想单击名为 mark 的按钮并仅更改 td.

中 1 个的颜色
 $('#mark').click(function(){
    var h2 = parseInt($('#h2').attr('value'), 10);
    //h2 returns the number 3
        $('#markTD').find('value',h2).css("color","red");  //this is the line that's not working

}

HTML

<table id='markTable'>
<tr>
    <td>Question number:</td>
    <?php 
        $q=1;
        while ($q <= $num_rows){
            echo "<td class='markTD' value='" . $q . "'>" . $q .  "</td>";
            $q++;
        }

    ?>
</tr>
</table>
 $('#markTD').find('value',h2).css("color","red");

这一行不起作用,因为 find 只接受一个参数,即选择器

尝试使用 $('#markTD').each,然后使用 .css() 到 return 并检查您需要的值。

您可以使用 .eq() 方法来选择要更改的 tf,例如,使用 0 值可以获取第一个元素 jQuery array

  $('#markTD').find('value',h2).eq(0).css("color","red"); 
See the answer in javascript:

1. In your function get all the tds in collection.

2. Get the length of the collection.

3. Get a random value from 0 to the (length - 1) of your collection.

4. Use the random number to access one of your tds and change the colour.

See sample html below:


<html>
<head>
<script>

function ChangeColor()
{

    var tdCol = document.getElementsByClassName("markTD");

    var length = tdCol.length;

    var randomTdIndex =  Math.floor(Math.random() * (length - 0)) + 0 ;

 /* clear all colors // this loop is not important. I used it to clear all colors just incase there was a coloured td */

   for(var i = 0 ; i < length ; i++)
   {
    tdCol[i].style.backgroundColor = "white";
   }

    tdCol[randomTdIndex].style.backgroundColor = "red";

} 

</script>
</head>

<body>
<table>
<tr><td class="markTD" >td 1</td><td class="markTD">td 2</td></tr>
<tr><td class="markTD">td 2</td><td class="markTD">td 4</td></tr>
<tr><td class="markTD">td 5</td><td class="markTD">td 6</td></tr>
</table>

<input type="button" onclick="ChangeColor()" value="Update TD" />
</body>
</html>