如何在单击onClick()事件

时间:2016-07-07 11:52:23

标签: javascript jquery html css

我正在使用scrollTop()事件来显示/隐藏div在某个位置我也使用onClick()事件来永久隐藏div,事件工作正常但问题是当我滚动页面然后div再次出现。 我的代码如下。

Javascript代码

<script type="text/javascript">
    $(document).scroll(function() {
        if (screen.width > 768) {
            var y = $(this).scrollTop();
            if (y < 500) {
                $('.benchdiv').fadeOut();
            }
            else {
                $('.benchdiv').fadeIn();
            }
        }
    });
</script>
<script type="text/javascript">
    $(document).ready(function(){
        $(".removebg").click(function(){
            $(".benchdiv").hide();
        });
    });
</script>

HTML代码

<div class="benchdiv">
    <a href="http://www.benchmarkemail.com?p=636276" target=_blank><img src="//www.benchmarkemail.com/images/partner/banners/125x125.gif" width="125" height="125" border="0" /></a>
    <div class="benchremove"><a href="javascript:void(0);" class="removebg glyphicon glyphicon-remove"></a></div>
 </div>

2 个答案:

答案 0 :(得分:1)

使用

$(".benchdiv").remove();

而不是

$(".benchdiv").hide();

永久删除div。

作品?

答案 1 :(得分:0)

您可以删除元素:

$(".benchdiv").remove();

或者如果您稍后使用它,您可以执行以下操作:

<script type="text/javascript">
var clicked = false;
    $(document).scroll(function() {
  if(!clicked){
        if (screen.width > 768) {
            var y = $(this).scrollTop();
            if (y < 500) {
                $('.benchdiv').fadeOut();
            }
            else {
                $('.benchdiv').fadeIn();
            }
        }
      }
    });
</script>
<script type="text/javascript">
    $(document).ready(function(){
        $(".removebg").click(function(){
            $(".benchdiv").hide();
            clicked = true;
        });
    });
</script>