选中输入标签复选框时显示文本

Question

我试图在用户选择输入标签时显示文本，

例如，我有以下代码：

<tr>
    <td class="align">
        Yes <br/>
        <input type="checkbox" />
    </td>
</tr>

一旦用户单击复选框，将出现以下文本:

“如果您选择了是，……”

我不确定JavaScript是否是实现这一点的最佳途径。

但是，如果是的话，会是这样的吗

<script>
    $(function(){ 
         if(input was checked)//not sure what would go here, new to Javascript
             display results//not sure either, new to Javascript
    });
</script>

Answer 1

匿名用户

不需要JS，

您可以通过仅使用CSS的解决方案来实现这一点，

使用相邻同级选择器< code> 和< code>:checked

css prettyprint-override">.text {
  display: none
}
input:checked + .text {
  display: inline-block
}

<table>
  <tr>
    <td>
      <span class="select">yes</span>
      <input type="checkbox" />
      <span class="text">If you have selected yes,.....</span>
    </td>
  </tr>
</table>

Answer 2

使用jQuery，要获得复选框的值，可以这样做

$（“输入[type='checkbox']）.val（）

或者您可以通过以下方式获取class/id

$（'. chekboxClass'）. val（）；$（'#check boxId'）. val（）；

Answer 3

如果你能把文本放在后面，你就能在CSS中做到。

html prettyprint-override">Yes<br />
<input type="checkbox" />
<span class="message">You have said Yes</span>

.message {
   display: none;
}
input[type=checkbox]:checked ~ .message {
   display: block;
}