состояние флажка должно сохранять состояние, чтобы скрыть / показать текст при загрузке страницы

Question

в качестве ответа до на этот вопрос , хотя значение флажка сохраняется при загрузке страницы, текст отображается при загрузке страницы, даже если флажок снят. текст должен скрываться / отображаться только в том случае, если пользователь снял / установил флажок в течение сеанса или пока он не закрыл браузер.

код js, в котором хранится состояние флажка:

function getStorage(key_prefix) {
    // this function will return us an object with a "set" and "get" method
    // using either localStorage if available, or defaulting to document.cookie
    if (window.localStorage) {
      // use localStorage:
      return {
        set: function(id, data) {
          localStorage.setItem(key_prefix+id, data);
        },
        get: function(id) {
          return localStorage.getItem(key_prefix+id);
        }
      };
    } else {
      // use document.cookie:
      return {
         set: function(id, data) {
           document.cookie = key_prefix+id+'='+encodeURIComponent(data);
         },
         get: function(id, data) {
           var cookies = document.cookie, parsed = {};
           cookies.replace(/([^=]+)=([^;]*);?\s*/g, function(whole, key, value) {
              parsed[key] = decodeURIComponent(value);
           });
           return parsed[key_prefix+id];
         }
       };
     }
  }

jQuery(function($) {
  // a key prefix is used for the cookie/storage
  var storedData = getStorage('com_mysite_checkboxes_'); 

  $('div.check input:checkbox').bind('change',function(){
    $('#ab_'+this.id).toggle($(this).is(':checked'));
    // save the data on change
    storedData.set(this.id, $(this).is(':checked')?'checked':'not');
  }).each(function() {
    // on load, set the value to what we read from storage:
    var val = storedData.get(this.id);
    if (val == 'checked') $(this).attr('checked', 'checked');
    if (val == 'not') $(this).removeAttr('checked');
    if (val) $(this).trigger('change');
  });

});

этот код ^ должен работать, но он сохраняет состояние флажка, но не для текста. это потому, что текст вызывается со страницы php?

HTML:

    $(document).ready(function() {
        $("#bquote").load("quotes_in.php");     
    });


.. ...

<div class="check">
<p><input type="checkbox" value="Name" id="name" checked /> <label for="name">Name</label></p>  
<p><input type="checkbox" value="Reference " id="reference" checked /> <label for="reference">Reference</label></p>
    </div>

.. ...

    <blockquote id="bquote">
        &nbsp;  
    </blockquote>

PHP:

public function formatQuotes($row)
{

    return "<p id=\"ab_name\">" . $this->h($row['cName']) . "</p><br />"
    . "<p id=\"ab_reference\">" . $this->h($row['vReference']) . "</p>"; 

}

Answer 1

Вам необходимо вызвать событие change() в документе, готовом после генерации элементов p.

Edit:

Если размещение триггера изменения после вызова .load() не работает, это, вероятно, связано с тем, что запрос ajax еще не завершен в момент запуска. Это можно решить с помощью параметра callback, равного .load(). Поэтому код должен выглядеть примерно так:

$(document).ready(function() {
    $("#bquote").load("quotes_in.php", function() {
        // create the P elements
        // trigger the change() event
    });
});