Question

我在页面上使用jQuery的load函数来获取网页的内容然后打印它。这是我的代码：

$('#container').load('<?php print $_GET['load']; ?>', function(data) {

    window.print();
});

变量'load'是url。

问题是正在加载的页面附有一个javascript设计的过滤器，这意味着，在该页面上，用户可以点击按钮来删除或显示某些信息，例如{ display: none }。

然而，用户DO隐藏的项目会显示在此新页面中。我明白为什么会这样，JavaScript并没有改变页面的基本HTML，它仍然存在，但我想找到解决这个问题的方法。

Answer 1

因此，当使用新内容刷新#container时，所有旧的DOM元素（HTML的内部版本）都会被销毁和替换 - 因此它会丢失display：none属性。

解决这个问题的一种方法是做这样的事情：

<div id='container'>
  <div class="a">Stuff 1</div>
  <div class="b">Stuff 2</div>
  <div class="c">Stuff 3</div>
</div>

<input type="button" class="hide_something" data-hide-class="a" value="Hide A">
<input type="button" class="hide_something" data-hide-class="b" value="Hide B">
<input type="button" class="hide_something" data-hide-class="c" value="Hide C">

$('.hide_something').on("click", function() { 
  $('#container').addClass('hide_' + $(this).data("hide-class")); 
});


.hide_a .a,
.hide_b .b,
.hide_c .c { display: none; }

这是一个小提琴：http://jsfiddle.net/2Qkjn/

基本上，当用户点击一个按钮时，它会向外部容器添加一个类，CSS会导致该内容隐藏内部内容。替换内部内容不会改变CSS规则。

另一种方法是在JS中存储状态，然后在DOM重新加载时刷新它们。

jquery加载函数忽略动态变化

1 个答案: