私はこの問題を解決するJavaScript + HTML

Question

UPDATE

と、前のページに戻るしようとすると、それは私が「ID」間違った名前の、非常に愚かでした。実際には：id = "especies_menu_left"のときはid = "groups_menu_left"でした。 あなたの人の時間を無駄にして申し訳ありません。

「戻る」という意味の「Voltar」というボタンを押すと戻ってこないので誰でも助けてくれますか？ 私のアプリケーションは基本的にシェルターのデータベースなので、新しいペットを採用したいときは、シェルターのさまざまなオプションを探すことができます。 「種」を選択すると、そのカテゴリのすべての動物が表示され、動物が好きなときは、それをクリックすると詳細が表示されます。しかし、何らかの理由で特定の情報が気に入らなければ、彼らはもっと多くの動物を探すために戻ることができ、それはボタン "Voltar"が役立つところですが、うまくいきません。私がそれをクリックすると何もしません。デバッグ時にエラーが表示されないので、コード内に何かがないと思われます。

(function($) { 
 

 
    $.extend({ 
 

 
    route: function(path) { 
 

 
     var previousUrl = window.location.hash.slice(1); 
 
     window.location.hash = '#' + path; 
 

 
     var pathArray = path.split('/'); 
 

 
     $('div[id^="template_"]').hide(); 
 
     $('button[id^="menu_"]').hide(); 
 

 
     var routes = [{ 
 
      id: 1, 
 
      name: 'index', 
 
      regex: '(index)' 
 
     }, // index 
 
     { 
 
      id: 2, 
 
      name: 'register', 
 
      regex: '(register)' 
 
     }, // register 
 
     { 
 
      id: 3, 
 
      name: 'especies', 
 
      regex: '(especies)' 
 
     }, // especies 
 
     { 
 
      id: 4, 
 
      name: 'especie_show', 
 
      regex: '(especie).*?(\\d+)' 
 
     }, // especie/{:id} 
 
     { 
 
      id: 5, 
 
      name: 'animal_show', 
 
      regex: '(animal).*?(\\d+)$' 
 
     }, // animal/{:id} 
 

 
     ]; 
 

 
     var route = 0; 
 
     var template = null; 
 

 
     $.each(routes, function() { 
 
     var test = new RegExp(this.regex); 
 

 
     if (test.test(path)) { 
 
      route = this.id; 
 
      template = this.name; 
 
     } 
 
     }); 
 

 
     //Logout button 
 
     $('#' + template + '_menu_logout').on('click', function() { 
 
     removeToken('token'); 
 
     }); 
 

 
     switch (template) { 
 

 
     case 'index': 
 
      break; 
 

 
     case 'register': 
 
      break; 
 

 
     case 'especies': 
 
      setButton('left', template, 'index', 'redirect', null); 
 

 
      $.api.getRecords('especie', null, getToken('token'), populateEspeciesTable); 
 
      break; 
 

 

 
     case 'especie_show': 
 
      setButton('left', template, 'especies', 'redirect', null); 
 
      setButton('right', template, 'especie/' + pathArray[1] + '/edit', 'redirect', null); 
 

 

 
      var params = 'filter=id_especie%3D' + pathArray[1] + '&fields=nome_especie'; 
 
      $.api.getRecords('especie', params, getToken('token'), populateEspecieShowName); 
 

 
      params = 'filter=especie_id_especie%3D' + pathArray[1] + '&fields=nome_animal, notas_animal, foto_animal'; 
 
      $.api.getRecords('animal', params, getToken('token'), populateEspecieTable); 
 

 
      break; 
 

 
     case 'animal_show': 
 
      var animalId = $('#id_animal').val(); 
 

 
      setButton('left', template, 'especie/' + animalId, 'redirect', null); 
 
      setButton('right', template, 'animal/' + pathArray[1] + '/edit', 'redirect', null); 
 

 
      var params = 'filter=id_animal%3D' + pathArray[1] + '&fields=nome_animal'; 
 
      $.api.getRecords('animal/' + pathArray[1], null, getToken('token'), populateAnimal); 
 

 
      var urlParts = previousUrl.split('/'); 
 
      $('#id_animal').val(urlParts[1]); 
 

 
      break; 
 

 
     } 
 

 
     $('#template_' + template).show(); 
 
    } 
 
    }); 
 

 

 
    function setButton(button, page, url, type, func) { 
 
    switch (type) { 
 
     case 'redirect': 
 
     $('#' + page + '_menu_' + button).off().on('click', function() { 
 
      $.route(url); 
 
     }); 
 
     break; 
 
    } 
 
    } 
 

 
}(jQuery));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 

 
<div id="template_especies"> 
 
    <nav class="navbar navbar-fixed-top df-nav cen col-md-12" role="navigation" style=""> 
 
    <ul class="nav navbar-nav" style="width: 100%"> 
 
     <li style="float: none; display: inline-block; position: relative; text-align: center"> 
 
     <a href="#index"><img src="img/icone_ap.png" height="47"></a> 
 
     </li> 
 
    </ul> 
 
    </nav> 
 
    <div class="row vert-offset-top-30"></div> 
 
    <div class="col-md-2"></div> 
 
    <div class="col-md-8"> 
 
    <img src="img/cao.jpg" width="150" hspace="20"> <img src="img/gato.jpg" width="150"> 
 
    <table class="table" id="table_especies"> 
 
     <thead> 
 
     <tr> 
 
      <td></td> 
 
      <td></td> 
 
     </tr> 
 
     </thead> 
 
     <tbody> 
 
     </tbody> 
 
    </table> 
 
    </div> 
 
    <footer> 
 
    <ul class="nav navbar-nav" style="width: 100%"> 
 
     <li class="pull-left"><button type="button" id="groups_menu_left" class="btn btn-default btn-menu">Voltar</button></li> 
 
     <li class="pull-left"><button type="button" id="groups_menu_logout" class="btn btn-default btn-menu-logout">Sair</button></li> 
 
    </ul> 
 
    </footer> 
 
    <div class="col-md-2"></div> 
 
</div>

事前に感謝します！

Answer 1

は、あなたは以下のことを試すことができますonclick="window.history.back();

でwindow.history.back();を使用して要素に取り付ける試してみてください。

<li class="pull-left"> 
 
    <button type="button" onclick="window.history.back();" id="groups_menu_left" class="btn btn-default btn-menu" >Voltar</button> 
 
</li>

UPDATE：私はあなたの問題を理解していれば、私は知りませんが、あなたは試すことができます：

<li class="pull-left"> 
    <a href="../"><button type="button" id="groups_menu_left" class="btn btn-default btn-menu" >Voltar</button></a> 
</li>