2016-08-04 18 views
0

特定のsessionStorage値を削除できるかどうかは、JQueryを使用してどのように達成できますか?これまでのところ私は入力フィールドを削除することができますが、私はsessionStorageの値を削除することはできません。私のコードは以下の通りです。ここでJQueryを使用して特定のsessionStorage値を削除する方法

は私のjsfiddle https://jsfiddle.net/fj324rzg/1/

HTML

<ul> 
    <li> 
     <div class="worker-container-last"> 
      <label class="worker-label"> 
       <select name="title[]" class="title"> 
        <option value="Select a Title" selected="selected">Select a Title</option> 
        <option value="Boss">Boss</option> 
        <option value="Worker">Worker</option> 
        <option value="Manager">Manager</option> 
       </select> 
      </label> 
     </div> 
     <div class="add-more"></div> 
     <div><a class="worker" title="" href="">Add Another Worker</a></div> 
    </li> 
</ul> 

であるjQueryの

var worker_record = []; 
$(document).ready(function(){ 
    workerData(); 
    $('.worker').on('click', function(e){ 
     e.preventDefault(); 
     e.stopPropagation(); 

     var title = $('.title:first').val();    

     var someData = {title: title}; 
     worker_record.push(someData); 

     sessionStorage.worker = JSON.stringify(worker_record); 
     workerData(); 
    }); 

    function workerData(){ 
     var max_fields = 6; 
     var x = 1; 

     if(!(typeof sessionStorage.worker === 'undefined' || sessionStorage.worker.length<1)){ 
      worker_record = JSON.parse(sessionStorage.worker); 
     } 

     $('.add-more').empty(); 
     for(var i=0; i<worker_record.length; i++){ 
      if(x < max_fields){ 
       x++; 
       var title = worker_record[i].title; 

       var worker = '<div><div class="delete-worker"><a title="" href="#">Delete</a></div><select name="title[]" class="title title-options"><option value="Select a Title" selected="selected">Select a Title</option><option value="Boss">Boss</option><option value="Worker">Worker</option><option value="Manager">Manager</option></select></div>'; 

       $('.add-more').append(worker); 
       $('.title:eq('+$('.title-options').length+')').val(title); 
      } 
     } 

     $('.title:first').val('Select a Title'); 
    } 

    $('.add-more').on('click', '.delete-worker', function(e){ 
     e.preventDefault(); 
     e.stopPropagation();  

     $(this).parent('div').remove(); x--; 
    }); 
}); 

答えて

2

removEvent.YouだけのDOM以下content.Referを取り外すときは、労働者のレコードを削除しませんセッションストアからワーカーレコードを削除する場合

worker_record = JSON.parse(sessionStorage.worker); 
    alert(worker_record); 
    worker_record.splice(worker_record.length -1, 1);// Record index passed as 2nd paramter 
    alert(worker_record); 
    sessionStorage.worker = JSON.stringify(worker_record); 
+0

次のエラーが発生しました。「Uncaught ReferenceError:x is not defined」他にも問題ありません。 – obi

+0

ファンクション外のxにはアクセスできません。 インデックスを削除してDomを削除し、スプライス引数 – tsb

+0

に渡すことができます。入力を削除すると、別の入力を追加できなくなります。 – obi

関連する問題