0

専門家は新人がチェックボックスの選択に基づいてタグを表示/非表示にするのを手伝うことができますか?

基本的に、ページの読み込み時に id=q2 を非表示にする必要があります。ユーザーが最初のチェックボックスをオンにすると表示され、オフにすると非表示になります。

このサイトにあるコードを実装しようとしましたが、うまくいきません。

これは私のjqueryコードで、IDを使用しています

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     <title>Untitled Document</title>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
 <script language="javascript">

    $(document).ready(function() { 

       $("#q2").hide();   

       $("#q1a").change(function () {
           if(this.checked) {
        $('#q2').show();
    } else {
        $('#q2').hide();
    }   

    });
})
 </script>
 </head>

これは私の HTML 部分で、最初のチェックボックスに応じて、id=q2 を表示/非表示にする必要があります。

 <body>
 <table>
   <tr>
     <td colspan="2"><input type="checkbox" name="Quais_medicamentos_voce_utiliza_Insulina" value="1" id="q1a" />
       &nbsp;&nbsp;Insulina<br />
       <input type="checkbox" name="Quais_medicamentos_voce_utiliza_GLP_1" value="1" />
       &nbsp;&nbsp;Análogo de GLP-1 (Victoza ou Byetta)<br />
       <input type="checkbox" name="Quais_medicamentos_voce_utiliza_Antidiabetico" value="1" />
       &nbsp;&nbsp;Antidiabético Oral (comprimido)<br />
       <input type="checkbox" name="Quais_medicamentos_voce_utiliza_Nao_utilizo" value="1" />
       &nbsp;&nbsp;Não utilizo nenhum medicamento<br />
       <input type="checkbox" name="Quais_medicamentos_voce_utiliza_Nao_sei" value="1" />
       &nbsp;&nbsp;Não sei</td>
   </tr>
   <tr>
     <td>&nbsp;</td>
   </tr>
   <div id="q2">
     <tr>
       <td height="23" colspan="2">Quais insulinas você utiliza?</td>
     </tr>
     <tr>
       <td colspan="2"><table width="809">
           <tr>
            <td width="173" valign="top"><input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Apidra" value="1" />
               &nbsp;&nbsp;Apidra<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humalog_Mix_25" value="1" />
               &nbsp;&nbsp;Humalog Mix 25<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humalog" value="1" />
               &nbsp;&nbsp;Humalog<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humalog_Mix_50" value="1" />
               &nbsp;&nbsp;Humalog Mix 50<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humulin_70_30" value="1" />
               &nbsp;&nbsp;Humulin 70/30<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humulin_N" value="1" />
               &nbsp;Humulin N <br /></td>
            <td width="157" valign="top"><p>
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Humulin_R" value="1" />
                &nbsp;Humulin R<br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Insunorm_N" value="1" />
                &nbsp;Insunorm N<br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Insunorm_R" value="1" />
                &nbsp;Insunorm R<br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Insunorm_70_30" value="1" />
                &nbsp;Insunorm 70/30 <br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Lantus" value="1" />
                &nbsp;Lantus <br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Levemir" value="1" />
                &nbsp;Levemir<br />
                <br />
              </p></td>
            <td width="187" valign="top"><input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Novolin_70_30" value="1" />
               &nbsp;&nbsp;Novolin 70/30 <br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Novolin_N" value="1" />
               &nbsp;&nbsp;Novolin N<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Novolin_R" value="1" />
               &nbsp;Novolin R<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_NovoMix_30" value="1" />
               &nbsp;NovoMix 30<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Novorapid" value="1" />
               &nbsp;Novorapid<br />
               <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Farmanguinhos_NPH" value="1" />
               &nbsp;Farmanguinhos  - NPH </td>
            <td width="272" valign="top"><p>
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Farmanguinhos_regular" value="1" />
                &nbsp;Farmanguinhos - Regular <br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Farmanguinhos_NPH_30_70" value="1" />
                &nbsp;Farmanguinhos - 30/70 <br />
                <input type="checkbox" name="Qual_is_insulinas_voce_utiliza_Nao_sabe" value="1" />
                &nbsp;Não sabe <br />
              </p></td>
          </tr>
         </table></td>
     </tr>
   </div>
 </table>
</body>
</html>
4

3 に答える 3

2

すべてを 1 つの大きなテーブルに保持するのではなく、代わりに 2 つのテーブルを作成し、もう一方を非表示にして表示し、必要に応じてそれらがリンクされていることを示すために SECTION またはその他のセマンティック構造でそれらを囲みます。

それができない場合は、上部セクションと下部セクションを THEAD と TBODY で区切り、TBODY にq2ID を指定します。そのようなテーブルの途中で DIV を使用することは、意味的に正しくありません。

トップビットの周りにTHEADがあり、DIVがTBODYに置き換えられたテーブルを操作するコードは次のとおりです

http://jsfiddle.net/TNMwh/

于 2013-03-12T20:03:05.727 に答える
1

div と tr を混在させることはできません

</tr>
<div id="q2">
<tr>

これは間違っています

代わりに id="q2" を tr 要素に追加します

<tr id="q2">...</tr>
于 2013-03-12T19:59:05.057 に答える
0

<tr>a の中に a を配置することはできません<div> 1 つだけを非表示にする場合は<tr>、それに id 属性を追加し<tr> ます テーブルからさらに行を非表示にする場合は、次のようにします。 1. css クラスを定義します。たとえば、hiddenRow: .hiddenRow {display:none;} 2. このクラスを非表示にする必要があるすべての行 3.スクリプトを次のように更新します$("tr.hiddenRow").hide();

于 2013-03-12T20:03:47.877 に答える