18910140161

JavaScript-在我的本地存储jQuery代码上添加了新字段-堆栈溢出

顺晟科技

2022-10-18 13:04:17

230

当我尝试在我的HTML上添加另一个文本区域时,本地存储不工作,但当它只有一个时,它工作正常。我还尝试在现有的jQuery代码上添加新的jQuery代码,但仍然不起作用。请查看CodePen链接以尝试我的原始代码。

$(document).ready(function() {
  var storage = false;
  if (typeof(Storage) !== "undefined") {
    if (localStorage.list != undefined) {
      list = JSON.parse(localStorage.getItem("list"));
      if (Object.keys(list).length > 0) {
        $('title').text("You have (" + Object.keys(list).length + ") item/s on your ToDo List");
      }
      for (var i = 0; i < Object.keys(list).length; i++) {
        Object.keys(list)[i]
        $('.sNote').append(
          '<div class="list-item" data-postid="' + Object.keys(list)[i] + '">' + list[(Object.keys(list)[i])] +
          '</div><div class="close"><i class="fas fa-times"></i></div>'
        );
      }
    } else {
      var list = {};
    }
    storage = true;
  } else {
    // No Local Storage
    var list = {};
  }

  function randChar(s) {
    e = "";
    for (var i = 0; i < s; i++) {
      e += String.fromCharCode(65 + Math.floor(Math.random() * 26));
    }
    return e;
  }
  $('.aNote').on('click', function() {
    i = $('.iNote-items').val();
    if (i != "") {
      uniqid = Date.now();
      id = (uniqid / 1231).toString().split(".")[1] + randChar(4);
      list[id] = i;
      $('title').text("You have (" + Object.keys(list).length + ") item/s on your ToDo List");
      if (storage) {
        localStorage.setItem("list", JSON.stringify(list));
      }
      $('.iNote-items').val("");
      $('.sNote').append(
        '<div class="list-item" data-postid="' + id + '">' + i +
        '</div><div class="close"><i class="fas fa-times"></i></div>'
      );
    } else {
      $('.iNote-items').focus();
    }
  });
  $('.iNote-items').keypress('', function(event) {
    if (event.keyCode === 13) {
      $('.aNote').click();
    }
  });

  $(document).on('click', '.close', function() {
    //console.log("test");
    delete list[$(this).prev('.list-item').attr('data-postid')];
    if (storage) {
      localStorage.setItem("list", JSON.stringify(list));
    }
    $(this).prev(".list-item").remove();
    $(this).remove()
    if (Object.keys(list).length > 0) {
      $('title').text("You have (" + Object.keys(list).length + ") item/s on your ToDo List");
    } else {
      $('title').text('ToDo List');
    }
  })
});
<代码><;script SRC=“ https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js ”>;<;/script>;<;DIV类=“ iNote-C ”>;<;DIV类=“ iNote-inputs ”>;<;textarea CLASS=“ HRD ” ROWS=“ 3 ”>;<;/textarea>;<;textarea类=“ iNote-items ”行=“ 3 ”>;<;/textarea>;<;DIV类=“注释”>;保存<;/DIV>;<;/DIV>;<;DIV类=“ snote ”>;<;/DIV>;<;/DIV>;


顺晟科技:

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航