jQueryが - 私が表示されますまたはダウンボタンをクリックすると非表示になり、グループのdivをしたい</p> <p>..最も近いdiv要素を取得し、私はここstackoverflowの中で検索が、私の場合のための解決策を見つけるdidntの

を示しました。jQueryが - 私が表示されますまたはダウンボタンをクリックすると非表示になり、グループのdivをしたい</p> <p>..最も近いdiv要素を取得し、私はここstackoverflowの中で検索が、私の場合のための解決策を見つけるdidntの

<!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" /> 
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> 
    <title>Relatorio</title> 
<script src="/Scripts/jquery-1.8.2.js"></script> 


</head> 


<body style="border-top: solid 10px #ffffff" class="container"> 

    <div> 
     <div> 
      <div class="container"> 
       <div class="row"> 
        <div class="col-lg-8"> 
         <input type="text" id="" name="" /> 
        </div> 
        <div class="col-lg-4"> 
         <div>       

          <div> 

           <div style="border:1px solid black;font-size:20px;overflow:auto;">    

             <div class="container" style="background-color:orangered;padding-top:5px;padding-bottom:5px;"> 
              <div class="row"> 
               <div class="col-sm-12"> 
                Relatorio 01 
               </div> 
              </div> 
             </div> 

             <div class="container" style="background-color:orangered;padding-top:5px;padding-bottom:5px;color: white"> 
              <div class="row" style="text-align:right;"> 
               <div class="col-sm-8"> 
                field1 
               </div> 
               <div class="col-sm-4" style="text-align:right;"> 
                <div id='botabrefecha'> 
                 <i class='fa fa-angle-down'></i> 
                </div> 
               </div> 
              </div> 
             </div> 

             <div class="abrefecha" style="border:0px solid black;display:none"> 
              <div class="container" style="padding-top:5px;padding-bottom:5px;"> 
               <div class="row"> 
                <div class="col-sm-4"> 
                 field2 Group 
                </div> 
                <div class="col-sm-8" style="text-align:right;"> 
                 <input type="text" style="width:100%;" /> 
                </div> 
               </div> 
              </div> 

              <div class="container" style="padding-top:5px;padding-bottom:5px;"> 
               <div class="row"> 
                <div class="col-sm-4"> 
                 field3 Group 
                </div> 
                <div class="col-sm-8" style="text-align:right;"> 
                 <input type="text" style="width:100%;" /> 
                </div> 
               </div> 
              </div>      

             </div>  

             <div class="container" style="padding-top:5px;padding-bottom:5px;"> 
              <div class="row"> 
               <div class="col-sm-4"> 
                txtCampo3 
               </div> 
               <div class="col-sm-8" style="text-align:right;"> 
                <input type="text" style="width:100%;" /> 
               </div> 
              </div> 
             </div> 

           </div> 
          </div>  

         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 


</body> 
</html>

と、このjqueryの：：このHTML ..have

$(document).ready(function() { 

       $('#botabrefecha').on('click', function() { 

        var visivel = $(this).closest('div').find(".abrefecha").is(":visible"); 

        if (visivel) 
        { 

         $(this).closest('div').find(".abrefecha").hide(); 
        } 
        else 
        { 
         $(this).closest('div').find(".abrefecha").show(); 
        }    

       });    

      });

をしかし、私は彼が私のdivを表示または非表示に傾ける理由を知りません。私はテストし、彼が表示されているかどうかを返します...しかし、私は表示または非表示にしようとすると、何も起こらない...

アイデア？

ありがとうございます！あなたのコード内

ラファエル

出典

2017-11-21 Rafael Spessotto

あなたの選択肢は最も近いdivを取得し、そのコンテンツまたはそのコンテンツのクラスが「abrefecha」であるかどうかを検索します。しかし、最も近いdivには何もありません。 '$（this））.closest（ 'div.abrefecha'）'の代わりに – Kaddath

そこクラスabrefechaを含む唯一のdivがありますので、直接その要素にアクセスすることができます。要素の表示/非表示には、jQueryのトグル機能を使用できます。

toggle

あなたはそれがあなたのクリックハンドラ内で直接DIVアクセスすることができます。

$(document).ready(function() { 
    $('#botabrefecha').on('click', function() { 
     $('.abrefecha').toggle(); 
    });    
});

出典

2017-11-21 13:27:51 ztadic91

を試してみてください。うまくいくのだろうか？ –

これらのすべてを切り替えると、特定のグループまたは特定のクラスごとにid属性を設定し、必要に応じてそれらを切り替えることができます。クリックハンドラのセレクタを新しいクラス/ id – ztadic91

で更新するのは、要素をdinamically追加するためです。特定の画面では、このクラスでもっと多くの要素があります。 –

jQueryが - 私が表示されますまたはダウンボタンをクリックすると非表示になり、グループのdivをしたい</p> <p>..最も近いdiv要素を取得し、私はここstackoverflowの中で検索が、私の場合のための解決策を見つけるdidntの

答えて

関連する問題