1

我想根据从单选按钮中选择的值隐藏表格行。这些单选按钮是根据从下拉列表框中选择的值创建的。

这是我的代码

列表框的 HTML 代码

<select name="txtLT" id="LT" >
    <option value="a">a</option>
    <option value="b">b</option>
    <option value="c">c</option>
</select>

jQuery

$(document).ready(function() {
    $("#LT").change(function() {
        var selVal = $(this).val();
        $("#tblerow").html('');
        if(selVal == 'c') {
            $("#tblerow").append('<td><input type="radio" id="cmpof" name="cmpof" value="1" onclick="show()" />1 <input type="radio" id="cmpof"  name="cmpof" value="2"  onclick="hide()"/>2</td>');            
        }
    });
});

现在如果选择了单选按钮 2，那么带有 tr2 的表格行应该会消失。请帮助我找到解决方案。

编辑

我尝试了以下 JavaScript，但它没有隐藏该行。

function show() { document.getElementById('sbjrow').style.display = 'block'; }
function hide() { document.getElementById('sbjrow').style.display = 'none'; }

你能建议这里有什么问题吗？

4

1 回答 1

1

你可以像这样使用 jQuery 的hideandshow函数：

$(function () {
    $('#LT').change(function () {
        if ($(this).val() == 'c') {
            $('.radios').show();
        } else {
            $('.radios').hide();
        }
    });
    $('input[name=cmpof]').change(function () {
        if ($('#LT').val() == 'c' && $(this).val() == 'bar') {
           $('#table tr').eq(1).hide(); 
        } else {
           $('#table tr').eq(1).show(); 
        }
    });
});

如果您不希望默认显示表格行，只需使用 css 即可。

JsFiddle 示例： http: //jsfiddle.net/AX5TJ/1/
可能更接近您想要的更新版本：http: //jsfiddle.net/AX5TJ/2/

还要小心，你的脚本中有一个语法错误：当你定义时$("#LT").change(function() {，你必须用});

于 2013-02-26T23:51:49.830 回答