0 
<table>
    <tr>
       <th style="width: 15%;">Name</th>
       <th style="width: 15%;">Marks</th>
       <th>Grade</th>
    </tr>

    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select id="comboId"></select>
        </td>
    </tr>
</table>

现在我只想在更改下拉列表时更改颜色。任何人都可以通过 jQuery 帮助我吗

4

7 回答 7

1

尝试这个

演示

$(document).ready(function(){
$( ".comboId" ).change(function() {

    //make your chnages here
  $(this).closest('tr').css('color','red');
});
});

HTML

<table>
    <tr>
       <th style="width: 15%;">Name</th>
       <th style="width: 15%;">Marks</th>
       <th>Grade</th>
    </tr>

    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select class="comboId">
                 <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
                 </select>
        </td>
    </tr>
    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select class="comboId">
                 <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
                 </select>
        </td>
    </tr>
    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select class="comboId">
                 <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
                 </select>
        </td>
    </tr>
    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select class="comboId">
                 <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
                 </select>
        </td>
    </tr>
</table>
于 2013-08-14T12:49:44.097 回答
0

尝试这个

$( "#comboId" ).change(function() {
  $( "#tableId" ).css( "background-color", "red" );
});
于 2013-08-14T12:40:56.160 回答
0

为要添加此功能的所有下拉菜单指定一个类。

并将此事件应用于类 - comboDropdown（例如）

$("select.comboDropdown" ).change(function() {
$(this).parent().parent().css( "background-color", "YOUR COLOR" );
});
于 2013-08-14T12:45:32.413 回答
0

尝试这个

$(document).ready(function(){
$( "#comboId" ).change(function() {

    $(this).closest('tr').css('background','red');
});
});

并添加选项以供选择

<table>
    <tr>
       <th style="width: 15%;">Name</th>
       <th style="width: 15%;">Marks</th>
       <th>Grade</th>
    </tr>

    <tr id="tableId">
        <td  style="text-align:centre;">any value</td>
        <td  style="text-align:left;">other value</td>
        <td  style="text-align:left;">
            <select id="comboId">
                 <option value="option1" selected="selected">Option 1</option>
    <option value="option2">Option 2</option>
                 </select>
        </td>
    </tr>
</table>

这是[演示]

于 2013-08-14T12:46:16.497 回答
0

这将起作用：

$(document).ready( function() {
    $("#comboId").on("change", function() {
        $(this).parent().css("background-color", "red"); 
    });
});

见小提琴。

于 2013-08-14T12:40:36.927 回答
0

你可以使用onchange函数。

http://jsfiddle.net/w7EKT/

于 2013-08-14T12:41:57.600 回答
0

你在找这样的东西吗？

$('#comboId').change(function(){
    $('#tableId).css('background-color', '#ccc');
});
于 2013-08-14T12:38:41.347 回答