使用jquery将动态创建的表保存到localstorage

我试图保存动态创建的表的主体，但似乎在本地存储中保存的唯一东西是没有任何值的键？使用jquery将动态创建的表保存到localstorage

我对document.ready函数的位置是否与所有行为的方式都有关系也很感兴趣。

HTML：

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
    </head> 
    <body> 
     <form> 
     <p> 
     Naslov opravila: <input id="naslov" type="text" name="naslov"> 
     Vrsta opravila: <input id="vrsta" type="text" name="vrsta"> 
     Nivo pomembnosti: 
     <select name="nivo" class="nivo"> 
      <option value="1">1</option> 
      <option value="2">2</option> 
      <option value="3">3</option> 
      <option value="4">4</option> 
     </select> 
     <button id="button">Dodaj opravilo</button> 
     </form> 
     </p> 
     <img id="slika" src="minus.jpg" alt="slike ni mogoče prikazati"/><br/> 
     <table id="1" class="tabela" cellspacing="3" style="text-align:center"> 
      <thead> 
       <tr> 
        <th>#</th> 
        <th>Opravilo</th> 
        <th>Vrsta</th> 
        <th>Nujnost</th> 
        <th>Datum vnosa</th> 
       </tr> 
      </thead> 
      <tbody id="telo"> 
      </tbody> 

     </table> 
     <button id="odstrani">Odstrani</button> 
     <button id="shrani">Shrani</button> 
     <script src="script.js"></script> 
    </body> 
</html>

和Javascript：

$(document).ready(function() { 
    document.getElementById("1").innerHTML=localStorage.tabela; 
}); 

$('#button').on('click', function(event) { 
    var naslov = $('#naslov').val(); 
    var vrsta = $('#vrsta').val(); 
    var nivo = $('.nivo option:selected').val(); 
    var vrste = $('#telo').find('tr').length; 
    var datum = new Date(); 
    var d = datum.getDate() + "." + (datum.getMonth()+1) + "." + datum.getFullYear(); 
    if(naslov.length > 0) { 
     var novavrsta = $('<tr><td></td><td></td><td></td><td></td><td></td></tr>'); 
     novavrsta.children().eq(0).text(vrste+1); 
     novavrsta.children().eq(1).text(naslov); 
     novavrsta.children().eq(2).text(vrsta); 
     novavrsta.children().eq(3).text(nivo); 
     novavrsta.children().eq(4).text(d); 
     novavrsta.appendTo('#telo'); 
     $('#telo tr').addClass(function(index) { 
      return "vrsta" + (index+1); 
     }); 
    } 
    return false; 
}); 

$(document).on('click', '#telo tr', function(){ 
    if ($(this).hasClass("izbrano")){ 
     $(this).css("background-color","white"); 
     $(this).removeClass("izbrano"); 
    }else{ 
     $(this).css("background-color","red"); 
     $(this).addClass("izbrano"); 
    } 
}); 

$('#odstrani').on('click', function(event) { 
    $('.izbrano').remove(); 
}); 

$('#slika').on('click', function() { 
    if ($('.tabela, .odstrani').is(":hidden")) { 
    $('.tabela, .odstrani').slideDown("slow"); 
    $('#slika').attr('src', 'minus.jpg'); 
    } else { 
    $(".tabela, .odstrani").hide(); 
    $('#slika').attr('src', 'plus.jpg'); 
    } 
}); 

$(window).unload(function() { 
    localStorage.tabela=('.tabela').val(); 
});

来源

2014-01-14 x4nga

的问题是在你的代码的最后一行。这：

$(window).unload(function() { 
    localStorage.tabela=('.tabela).val(); 
});

应该变成这样：

$(window).unload(function() { 
    localStorage.tabela = $('.tabela').html(); 
});

来源

2014-01-14 10:54:43

使用jquery将动态创建的表保存到localstorage

回答

相关问题