隐藏<tr>基于选定的单选按钮

Question

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

这里是我的代码列表框

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

HTML代码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'; } 

请问这里有什么问题吗？

Answer 1

你可以只使用jQuery的hide和show功能，像这样：

$(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() {，你必须关闭与});