Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Jquery - поменять местами таблицы (https://javascript.ru/forum/jquery/54265-jquery-pomenyat-mestami-tablicy.html)

рони 11.03.2015 16:37

table reverse localStorage
 
Sergei-b84,
:-?
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<style type="text/css">
    table {
      display: none;
    }
    #table_up{
      background: #339900
    }
    #table_down{
      background: #FF6666
    }

</style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
    var table = $('#table_up, #table_down'), f = localStorage.getItem('f')||'';
    function show()
    {
    $(table[+!f]).insertAfter(table[+f])
    table.show();
    };
    $('button').click(function(e) {
    f  =  f ? '' : '1';
    show();
    localStorage.setItem('f', f);
});
    show() ;
});


  </script>
</head>

<body>
<table id="table_up" class="table">
   <caption>Basic Table UP</caption>
   <thead>
      <tr class="success">
         <th>Name</th>
         <th>City</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Tanmay</td>
         <td>Bangalore</td>
      </tr>
      <tr>
         <td>Sachin</td>
         <td>Mumbai</td>
      </tr>
   </tbody>
</table>




  <table id="table_down" class="table">
   <caption>Basic Table Down</caption>
   <thead>
      <tr>
         <th>Name</th>
         <th>City</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Tanmay</td>
         <td>Bangalore</td>
      </tr>
      <tr>
         <td>Sachin</td>
         <td>Mumbai</td>
      </tr>
   </tbody>
</table>
<button>table reverse</button>

</body>

</html>

laimas 11.03.2015 17:24

f = f ? '' : '1';

а не проще f ^=1 ?

рони 11.03.2015 17:34

:write: jQuery тут конечно нафиг
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<style type="text/css">
    table {
      display: none;
    }
    #table_up{
      background: #339900
    }
    #table_down{
      background: #FF6666
    }
    .show table {
      display:   table;
    }
</style>

  <script>
    window.onload = function() {
    var table = document.querySelectorAll("#table_up, #table_down"),
        button = document.querySelector("button"),
        parent = document.body,
        f = +localStorage.getItem("f") || 0;

    function show() {
        parent.insertBefore(table[+!f], table[f]);
        parent.classList.add("show")
    }
    button.onclick = function() {
        f ^= 1;
        show();
        localStorage.setItem("f", f)
    };
    show()
};
  </script>
</head>

<body>
<table id="table_up" class="table">
   <caption>Basic Table UP</caption>
   <thead>
      <tr class="success">
         <th>Name</th>
         <th>City</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Tanmay</td>
         <td>Bangalore</td>
      </tr>
      <tr>
         <td>Sachin</td>
         <td>Mumbai</td>
      </tr>
   </tbody>
</table>




  <table id="table_down" class="table">
   <caption>Basic Table Down</caption>
   <thead>
      <tr>
         <th>Name</th>
         <th>City</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>Tanmay</td>
         <td>Bangalore</td>
      </tr>
      <tr>
         <td>Sachin</td>
         <td>Mumbai</td>
      </tr>
   </tbody>
</table>
<button>table reverse</button>

</body>

</html>

рони 11.03.2015 17:39

Цитата:

Сообщение от laimas
а не проще f ^=1 ?

добавил
и изменил
Цитата:

Сообщение от рони
f = +localStorage.getItem("f") || 0;


laimas 11.03.2015 20:00

jQuery тут конечно нафиг

Так по условию тараканов именно на ней должно быть решение, иначе очередной студент не получит диплома :)


Часовой пояс GMT +3, время: 11:22.