`
huangyongxing310
  • 浏览: 490503 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

滚动到指定元素、判断对象是否为空

 
阅读更多 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="angular.min.js"></script>
    <script src="jquery.min.js"></script>
</head>
<body ng-app="myApp">

<div ng-controller="myController">
    <div style="height: 2000px" ng-click="clickDeal()">
        点我跳到bottom处
    </div>

    <button id="bottom">bottom</button>

</div>

</body>

<script>
    var app = angular.module('myApp', []);
    //定义服务
    app.service('commonFun', function ($http) {
        this.httpPost = function (url, dataObj, successFun, errorFun) {
            $http({
                method: 'POST',
                url: url,
                data: dataObj,
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded'
                },
                transformRequest: function (data) {
                    var str = '';
                    for (var i in data) {
                        str += i + '=' + data[i] + '&';
                    }
                    return str.substring(0, str.length - 1);
                }
            }).then(function successCallback(response) {
                if (successFun == null) {
                    alert("请求数据成功!")
                }
                else {
                    successFun(response);
                }
            }, function errorCallback(response) {
                //alert("getMenuListByMenuNameInRegex 请求数据错误!");
                if (errorFun == null) {
                    alert("url 请求数据错误!")
                } else {
                    errorFun(response);
                }
            });
        };

        this.httpPostFile = function (url, dataObj, successFun, errorFun) {
            var fd = new FormData();
            for (var i in dataObj) {
                fd.append(i, dataObj[i]);
            }
            $http({
                method: 'POST',
                url: url,
                data: fd,
                headers: {'Content-Type': undefined},
                transformRequest: angular.identity
            }).then(function successCallback(response) {
                if (successFun == null) {
                    alert("请求数据成功!")
                }
                else {
                    successFun(response);
                }
            }, function errorCallback(response) {
                //alert("getMenuListByMenuNameInRegex 请求数据错误!");
                if (errorFun == null) {
                    alert("url 请求数据错误!")
                } else {
                    errorFun(response);
                }
            });
        };

        this.httpGet = function (url, successFun, errorFun) {
            $http({
                method: 'GET',
                url: url
            }).then(function successCallback(response) {
                if (successFun == null) {
                    alert("请求数据成功!")
                }
                else {
                    successFun(response);
                }
            }, function errorCallback(response) {
                if (errorFun == null) {
                    alert("url 请求数据错误!")
                } else {
                    errorFun(response);
                }
            });
        };

        this.isEmptyObject = function (e) {
            var t;
            for (t in e) {
                return !1;
            }
            return !0
        };

        this.scollToElement = function (selector) {
//            console.info("selector == " + selector);
            var elementVar = $(selector);
            var num = elementVar.length;
//            console.info("num == " + num);
//            console.info("elementVar == " + elementVar);
            var elementHeight = elementVar.outerHeight(true);
//            console.info("elementHeight == " + elementHeight);
            //var elementOffsetTop = elementVar.offsetTop;
            var elementOffsetTop = elementVar.offset().top;
//            console.info("elementOffsetTop == " + elementOffsetTop);
            $(document).scrollTop(elementOffsetTop + elementHeight);
        }
    });

    app.controller('myController', function ($scope, commonFun) {
        $scope.clickDeal = function () {
            commonFun.scollToElement("#bottom");
        };

        $scope.aa={};
        console.info("aa == " + commonFun.isEmptyObject($scope.aa));

        $scope.bb={menuId:30000};
        console.info("bb == " + commonFun.isEmptyObject($scope.bb));


    });
</script>
</html>
分享到：
| lazyLoad
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    易语言滚动条位置判断源码.7z

    或者在滚动到某个特定位置时，显示或隐藏某些元素。因此，熟练掌握滚动条位置的判断和处理对于提高软件用户体验至关重要。 总结起来，这个压缩包提供了一个易语言实现滚动条位置判断的实例，可以帮助开发者了解和...

    JQ滚动条效果

    这里的核心逻辑是：当页面滚动到一定位置（即`scroH &gt;= navH`）时，将`.joinus_nav`元素的位置设置为`fixed`，使其固定在顶部；当页面滚动到未达到该位置时，则将其位置设置为`static`，恢复初始状态。 - `position...

    js实现鼠标滑动到某个div禁止滚动

    关于如何使用JavaScript实现当鼠标滑动到指定的div区域内时禁止页面滚动的功能，这是一个在前端开发中可能会遇到的实际需求。通常这种需求是在特定的操作场景中为了提供更好的用户体验而提出的。例如，在一个产品...

    MARQUEE 元素 marquee 对象 doc 手册

    - **用途**: 指定元素及其内容是否可以作为一个不可见单位统一选择。 - **示例**: 这个属性通常在内部文档中使用，用于控制选择行为，但在实际应用中并不常用。 3. **`BEGIN`** - `begin` - **用途**: 设置或...

    纯原生JS移动端阻止页面元素滚动插件

    2. 滑动导航：在侧滑菜单或幻灯片切换时，阻止整个页面的滚动，只允许指定元素进行滚动。 总结，这个纯原生JS移动端阻止页面元素滚动插件利用了JavaScript事件处理、DOM操作以及对移动端滚动特性的理解，提供了一个...

    JS判断页面是否出现滚动条的方法

    本文提供的实例展示了如何使用JavaScript来判断页面或指定元素是否出现滚动条。 首先，我们来看下提供的`isScroll`函数。这个函数接受一个可选参数`el`，用于指定要检查的元素。如果没有提供`el`，则默认检查文档的...

    JS实现利用闭包判断Dom元素和滚动条的方向示例

    在这个示例中，我们为指定的DOM元素绑定了事件监听器，根据事件类型来判断鼠标是进入还是离开元素，并通过计算鼠标相对于元素中心的位置坐标来确定鼠标是从元素的哪一侧进入或离开的。然后根据计算结果，在元素的...

    jquery如何获取元素的滚动条高度等实现代码

    在JavaScript和jQuery中，处理页面布局和用户交互时，经常需要获取各种元素的尺寸和位置信息，特别是当涉及到滚动条时。本篇文章将详细介绍如何使用jQuery来获取元素的滚动条高度以及其他相关实现代码。 首先，要...

    jq实现图片滚动（平滑滚动）.rar

    通过`$(selector).click(function(){...})`，我们可以为指定元素绑定点击事件，当用户点击时执行相应的函数。在这个案例中，我们需要定义两个点击事件，分别控制图片向上和向下的滚动。 3. **动画效果**：jQuery的`...

    jQuery滚动图片插件

    1. **jQuery选择器**：jQuery提供了一种简洁的方式来选取DOM元素，如`$("#id")`选取ID为指定值的元素，`$(".class")`选取所有类名为指定值的元素。在滚动图片插件中，我们可能需要选取包含图片的容器，或者用于控制...

    JavaScript 无缝上下滚动加定高停顿效果

    - **条件判断**：通过条件语句（如`if`、`switch`）来决定滚动的方向、是否暂停等行为。 ### 三、实际应用 1. **广告滚动条**：网站顶部或侧边栏常见的滚动广告，可以使用该技术实现。 2. **新闻滚动条**：新闻...

    javascript+div图片无缝滚动

    - **核心思想**：利用JavaScript定时器（`setInterval`）不断调整容器元素的`scrollTop`属性值来模拟滚动效果，并且当滚动到顶部或底部时瞬间跳转到另一个位置，形成无缝循环。 ##### 2. 关键代码解析 - **变量定义...

    javascript实现滚动条

    例如，创建一个滚动到指定位置的函数： ```javascript function smoothScroll(targetY) { var startY = window.pageYOffset; var endY = targetY; var distance = endY - startY; var duration = 1000; // 动画...

    swift-自定义定时器和无限滚动swift版本

    4. **监听滚动事件**：通过重写`scrollViewDidScroll(_:)`方法，我们可以检测滚动过程并判断何时需要切换到下一个或上一个元素。在适当的时候，可以调整数据源索引以达到无缝滚动的效果。 5. **自动滚动**：如果你...

    js判断鼠标位置是否在某个div中的方法

    在JavaScript编程中，判断鼠标位置是否在某个div元素内是一个常见的需求，尤其在制作交互式网页时非常有用。本文将详细介绍如何通过JavaScript实现这一功能，这涉及到鼠标事件的响应处理以及页面元素的位置属性操作...

    【JavaScript源代码】Vue鼠标滚轮滚动切换路由效果的实现方法.docx

    在根组件中，我们可以通过监听`$route`对象的变化，比较当前路由和前一个路由的`meta`信息来判断滚动方向。 总的来说，实现Vue中鼠轮滚动切换路由的效果，需要结合Vue的生命周期、路由监听、过渡动画以及路由元信息...

    jQuery右侧悬浮楼层滚动代码.zip

    通过比较这两个值，可以判断元素是否在视口内，从而决定是否显示。 4. **CSS样式调整**：使用CSS控制悬浮元素的定位，通常使用`position: fixed`让元素相对于浏览器窗口定位，`top`属性设置元素距离窗口顶部的距离...

    Javascript中找到子元素在父元素内相对位置的代码

    首先判断元素的父节点是否为空（即元素是否已经被删除或尚未添加到文档中），以及元素的样式 `display` 是否为 `none`（表示元素不显示），如果这两种情况中任何一种成立，则返回 `false`，意味着无法获取位置。...

    jQuery实现当拉动滚动条到底部加载数据的方法分析

    9. 自定义滚动元素的加载：除了监听window对象的滚动事件外，还可以监听指定元素内的滚动事件。当这个元素内的内容滚动到底部时，也可以触发加载操作。这可以通过将滚动事件监听器绑定到具有滚动条的div等元素上，并...

    (彬)泪闯天涯-取网页元素坐标

    这段代码将输出指定元素的顶部和左侧坐标。注意，这些坐标是相对于视口的，而不是整个网页。如果需要获取相对于整个文档的坐标，需要考虑滚动条的影响。 在自动化测试中，比如使用Selenium WebDriver，我们也可以...

Magicbox
Global site tag (gtag.js) - Google Analytics