javascript - 隐藏内容后如何刷新div

Question

我有以下代码：

// I am filling the data of the "MultiSelectDialog_List" div using javascript like this:

var s = ''; // JSON string ----- YOU NEED TO ADD AN EXAMPLE OF S
var jsonData = JSON.parse(s);
for (var i = 0; i < jsonData.length; i++) {

  // Hold the original list

  $("#MultiSelectDialog_List").append("<input type='checkbox'  id ='" + jsonData[i][idProp] + "'  value='" +
    jsonData[i][idProp] + "' data-value='" + jsonData[i][nameProp].toLowerCase() + "' > <label data-value ='" +
    jsonData[i][nameProp].toLowerCase() + "'  id ='lbl" + jsonData[i][idProp] + "'>" + jsonData[i][nameProp] + "</label> <br/>");
}



// Then I am using this script to hide some content:

var enteredText = $("#MultiSelectDialog_Search").val();
var ary = $("input[type='checkbox']:not([data-value*='" + enteredText.toLowerCase() + "'])");

for (var i = 0; i < ary.length; i++) {
  $("#" + ary[i]["id"]).hide();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="multiSelectDialog" title="Select">
  <input type="text" id="MultiSelectDialog_Search" name="MultiSelectDialog_Search" onchange="multiSelectDialog_Search_TextChanged()" />
  <div id="MultiSelectDialog_List" data-value="">
    <!--The data will goes here-->
  </div>
  <input type="hidden" name="MultiSelectDialog_Values" id="MultiSelectDialog_Values" />
  <button id="MultiSelectDialog_Submit" onclick="multiSelectDialog_SubmitButton_Click()">Submit</button>
</div>

问题是 div 的内容在隐藏某些元素后没有正确重绘。检查图像：

隐藏元素之前

隐藏元素时，请查看间隙

我应该如何刷新 div？我尝试使用 hide() 和 show()，fadein()。但没有用。

标签： javascriptjquerycssasp.netweb

Answer 1

尝试这样的事情

$(document).ready(function(){
    // use localStorage.removeItem('show'); to unset an item
    var show = localStorage.getItem('show');
    if(show === 'true'){
        $('#MultiSelectDialog_List').show();
    }
    
    $("#btn").click(function(event){
        event.preventDefault();
        $('#MultiSelectDialog_List').show();
        localStorage.setItem('show', 'true');
    });
});