删除元素并重新加载页面答案

【问题标题】：Remove elements and reload page删除元素并重新加载页面
【发布时间】：2018-06-02 23:15:58
【问题描述】：

我有一个搜索结果列表。用户通过勾选复选框来选择他们希望保留的搜索结果。完成选择后，他们单击“查看选择的选择”，页面将重新加载，仅包含他们的选择。

这样做的最佳方法是什么？我认为 jQuery remove() 但我不确定如何重新加载页面。页面重新加载是必须的，因为它将被制作成 PDF。

<ul>
    <li class="property-list">
        <input type="checkbox" class="category1"></input>
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1"></input>
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1"></input>
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1"></input>
        <div>content</div>
    </li>
</ul>
<button>View Chosen Selection</button>

【问题讨论】：

标签： jquery checkbox checked

【解决方案1】：

在 javascript 中使用 location.reload(true) 重新加载页面

【讨论】：

谢谢 - 这是我的代码 - 它不会重新加载 $( "button" ).click(function() { if (!$(".category1").is(":checked") ) { $( ".property-list" ).remove(); } location.reload(true) });
删除所有内容并仅放置 location.reload(true) 以查看它是否重新加载。我认为它没有重新加载，因为一些没有执行的坏功能。
是的，你是对的——它自己工作。这意味着删除部分不起作用。好的
我认为删除不起作用，因为我需要使用 (this)。你知道如何正确地写它 - 我认为这是错误的 if ($('input:checkbox')(this).is(':not(:checked)')) { //do something }
你不需要这个。在 w3schools 上检查检查的功能是如何工作的，我忘记了它是如何工作的，我认为有问题。

【解决方案2】：

我认为描述有点误导，但是已经应用了额外的更改以与错误描述保持一致。好的，要达到预期的效果，请使用以下代码：

<ul>
    <li class="property-list">
        <input type="checkbox" class="category1" id="elem1"/>
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1"  id="elem2" />
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1"  id="elem3"/>
        <div>content</div>
    </li>
    <li class="property-list">
        <input type="checkbox" class="category1" id="elem4"/>
        <div>content</div>
    </li>
</ul>
<button>View Chosen Selection</button>

还有JS端（保持被选元素的历史HTML5 Api sessionStorage已经被使用）：

    $(function(){
        var sStorage = window.sessionStorage || {},    
           getVal = sStorage.getItem('elemId') || null,
           $button = $('button');

          // bind 'click' event with input DOM node
          $(document).on('click', 'input[type=checkbox]', function(e) {
          var $idAttr = $(e.target).attr('id');

          // eval if elem is checked
          var isElementChecked = 
                $('#' +$idAttr ).is(':checked') ? 
                  sStorage.setItem('elemId', $idAttr) :
                    sStorage.removeItem('elemId');
          });

          if (typeof getVal === "undefined" || getVal === '') {
              $('#'+ sStorage.getItem('elemId'))
          }            
          else {
              $('#'+ sStorage.getItem('elemId')).
                      attr('checked', true);
          }

          // bind 'click' evt with button
          $(document).on('click', $button, function(){
            return location.reload();
          });
    });

【讨论】：

这只是刷新页面，不保留已检查的内容