同じセク​​ションの別のテーブルを非表示にして、バックボタンで表示します。

Question

セクションがあります。 そのテーブル内の要素がクリックされているときは常にテーブルを非表示にし、そのページを再ロードせずに別のテーブルを表示したいとします。 バックボタンを表示して、最初のセクションに戻ることもできます。あなたはあなたの質問で明らかにされていない場合 おかげ

<section class="tabs" id="content3"> 
     <table class="rwd-table"> 
<tr> 
    <th>Livre</th> 
    <th>Article de journal</th> 
    <th>Chapitre de livre</th> 
    <th>Conférence avec actes</th> 
</tr> 
<tr> 
    <td data-th="Livre"> <a href ="#">2008</a></td> 
    <td data-th="Article de journal">CESACO 2012-2015</td> 
    <td data-th="Chapitre de livre">M-Trace 2010-2013</td> 
    <td data-th="Conférence avec actes">M-Trace 2010-2013</td> 
</tr> 
<tr> 
    <td data-th="Livre">RSE 2010-2013</td> 
    <td data-th="Article de journal">CESACO 2012-2015</td> 
    <td data-th="Chapitre de livre">M-Trace 2010-2013</td> 
    <td data-th="Conférence avec actes">M-Trace 2010-2013</td> 
</tr> 

Answer 1

我々は明確な答えを与えることはできません。クリックしたテーブルを非表示にするには、hide（）を使用してください。表示する必要がある表/ボタンを表示するには、show（）を使用します。

$('#table1').on('click', function(){ 
$(this).hide(); 
$('#table2').show(); 
$('#backbutton').show(); 
}); 

Answer 2

あなたの要件を満たすサンプルコードがあります。これはangularjsで行われます。

必要に応じて更新してください。

ビュー

<button ng-click="back()">Back</button> 

<table id="tableId" border="1" ng-show="table1"> 
    <thead> 
     <tr> 
      <th> 
       Table 1 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
       <button ng-click="selectElement()">Element</button> 
      </td> 
     </tr> 
    </tbody> 
</table> 

<table id="tableId" border="1" ng-show="table2"> 
    <thead> 
     <tr> 
      <th> 
       Table 2 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
       column 
      </td> 
     </tr> 
    </tbody> 
</table> 

JSコントローラ

function MainController($scope) { 
    $scope.table1 = true; 
    $scope.table2 = false; 

    $scope.selectElement = function(){ 
     $scope.table1 = false; 
    $scope.table2 = true; 
    }; 

    $scope.back = function(){ 
     $scope.table1 = true; 
    $scope.table2 = false; 
    }; 
}