2017.11.15 表格的样式设定、AuguarJS服务和依赖注入、String 方法、_main__.py文件与 python -m、JS刷新页面

第一组:杨昊 有关表格的样式设定问题——固定头、列

前几天接到的任务中,有这样一个需求:就是表单的头部、首列需要固定,不要随着滚动条的变化而移动,如下:


2017.11.15 表格的样式设定、AuguarJS服务和依赖注入、String 方法、_main__.py文件与 python -m、JS刷新页面_第1张图片
image.png

去网上查了一下,这种操作主要是css方面的,方法有很多,但是都逃不过两个属性:

position: relative; 
z-index:99;

position属性:规定元素的定位类型,relative是指生成相对定位的元素,相对于其正常位置进行定位。比如"left:20" 会向元素的 left 位置添加 20 像素。

z-index属性:设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。其中,元素可拥有负的 z-index 属性值。z-index 仅能在定位元素上奏效。

我在实现这个操作时使用的是jQuery的方式,将样式动态注入。代码如下:

2017.11.15 表格的样式设定、AuguarJS服务和依赖注入、String 方法、_main__.py文件与 python -m、JS刷新页面_第2张图片
image.png

附代码:

首列固定

    $(".table-p").scroll(function () {
        if ($(".table-p").scrollTop() > 0) {
            var Htable_flinew2 = $(".table-p").scrollTop() + "px";
            $(".tdwid2").css("position", "relative");
            $(".tdwid2").css("background", "#fff");
            $(".tdwid2").css("top", Htable_flinew2);
        } else {
            $(".tdwid2").css("top", "0");
        }
        if ($(".table-p").scrollLeft() > 0) {
            var Htable_flinew = $(".table-p").scrollLeft() + "px";
            $(".table tbody tr td:first-child").css("left", Htable_flinew);
            $(".table thead tr th:first-child").css("left", Htable_flinew);
        } else {
            $(".table tbody tr td:first-child").css("left", "0");
            $(".table thead tr th:first-child").css("left", "0");
        }            
    })

第二组:冯佳丽 使用ng-repeat指令来循环图片数组并且加入img模板、AuguarJS服务和依赖注入、 scopes

1. 使用ng-repeat指令来循环图片数组并且加入img模板
function AlbumCtrl($scope) {
    scope.images = [
        {"image":"img/image_01.png", "description":"Image 01 description"},
        {"image":"img/image_02.png", "description":"Image 02 description"},
        {"image":"img/image_03.png", "description":"Image 03 description"},
        {"image":"img/image_04.png", "description":"Image 04 description"},
        {"image":"img/image_05.png", "description":"Image 05 description"}
    ];
}
2. AuguarJS服务和依赖注入
function EditCtrl($scope, $location, $routeParams) {
     // Something clever here...
}

定义自己的服务并且让它们注入:

angular.module('MyServiceModule', []).
    factory('notify', ['$window', function (win) {
    return function (msg) {
        win.alert(msg);
    };
}]);
function myController(scope, notifyService) {
    scope.callNotify = function (msg) {
        notifyService(msg);
    };
}
myController.$inject = ['$scope', 'notify']; 
3. scopes

$scope是一个把view(一个DOM元素)连结到controller上的对象。在我们的MVC结构里,这个 $scope 将成为model,它提供一个绑定到DOM元素(以及其子元素)上的excecution context。

$scope 实际上就是一个JavaScript对象,controller和view都可以访问它,所以我们可以利用它在两者间传递信息。在这个 $scope 对象里,我们既存储数据,又存储将要运行在view上的函数。

每一个Angular应用都会有一个 $rootScope。这个 $rootScope 是最顶级的scope,它对应着含有ng-app 指令属性的那个DOM元素。

app.run(function($rootScope) { $rootScope.name = "张三"; });

如果页面上没有明确设定 $scope ,Angular 就会把数据和函数都绑定到这里。

这样,我们就可以在view的任何地方访问这个name属性,使用模版表达式{{}},像这样:{{ name }} 。


第三组:黄华英 String 方法和页面调用

1. String 方法
String 方法 含义
string.charAt(i) 返回在 string 中 i 位置处的字符。
string.charCodeAt(i) 返回在 string 中 i 位置处的字符编码。比如字符串“hello world!”charCodeAt(1) 为101
str.indexOf(aaa, start) 在 str 中查找另一个字符串 aaa返回第一个被匹配字符的位置,否则返回-1,start表示查找的起始位置
str.lastIndexOf(aaa, start) 与 indexOf 方法类似,但它是从该字符串的末尾开始查找
strA.localeCompare(strB) 比较两个字符串。如果 strA比strB小,结果为负数,若相等结果为0
string.match(regexp) 它匹配一个字符串或者一个正则表达式,该方法类似 indexOf() 和 lastIndexOf(),但是它返回指定的值,而不是字符串的位置

比如

str=”123456”
匹配字符串str.match(“12”)得到12
匹配正则表达式str.match(/\d+/g)得到123456
str.replace(searchstr, replacestr)对 string 进行查找和替换操作,并返回一个新的字符串
string.split(select, limit),split 方法把这个 string 分隔成片段来创建一个字符串数组

例如

var Strarray =“123456789”
Strarray.split(‘’,4)得到{1},{2},{3},{456789}四个数组
string.ToLower(),把 string 中的所有字母转换为小写格式
string.ToUpper(),把 string 中的所有字母转换为大写格式
string.fromCharCode(char...),从一串数字中返回一个字符串

2. 页面调用
  • 后台调用父页面方法并且关闭当前页面
Page.ClientScript.RegisterStartupScript(this.GetType(), "", "alert('操作成功!'); 
parent.ParentFunction ();parent.CloseAlertPage();", true);
  • 前台子页面调用父页面方法
parent.Parent Function();
  • 父页面调用子页面(iframe)的js方法
window.frames["iframe子页面的name"].方法名();

第四组:张元一 __main__.py文件与 python -m

PYTHON 的 -M 参数用于将一个模块或者包作为一个脚本运行,而__MAIN__.PY 文件则相当于是一个包的”入口程序“。

首先我们需要来看看 PYTHON XXX.PY 与 PYTHON -M XXX.PY 的区别。两种运行 PYTHON 程序的方式的不同点在于,一种是直接运行,一种是当做模块来运行。

先来看一个简单的例子,假设有一个 PYTHON 文件 RUN.PY,其内容如下:

IMPORT SYS
PRINT SYS.PATH

我们用直接运行的方式启动(PYTHON RUN.PY),输出结果:

['/HOME/HUOTY/ABOUTME/PYTHONSTUDY/MAIN', ...]

然后以模块的方式运行(PYTHON -M RUN.PY):

['', ...]
/USR/BIN/PYTHON: NO MODULE NAMED RUN.PY

由于输出结果只列出了关键的部分,应该很容易看出他们之间的差异。直接运行是把 RUN.PY 文件所在的目录放到了 SYS.PATH 属性中。以模块方式运行是把你输入命令的目录(也就是当前工作路径),放到了 SYS.PATH 属性中。以模块方式运行还有一个不同的地方是,多出了一行 NO MODULE NAMED RUN.PY 的错误。实际上以模块方式运行时,PYTHON 先对 RUN.PY 执行一遍 IMPORT,所以 PRINT SYS.PATH 被成功执行,然后 PYTHON 才尝试运行 RUN.PY 模块,但是,在 PATH 变量中并没有 RUN.PY 这个模块,所以报错。而正确的运行方式,应该是 PYTHON -M RUN.

这个例子并不能明显的说明问题。接着我们来看看__MAIN__.PY的作用。

仍然先看例子,有如下一个包:

package
├── __init__.py
└── __main__.py
__init__.py
import sys
print "__init__"
print sys.path
__main__.py
import sys
print "__main__"
print sys.path

用 PYTHON -M PACKAGE 运行结果:

__init__
['', ...]
__main__
['', ...]

用 PYTHON PACKAGE 运行结果:

__main__
['package', ...]
  • 加上 -m 参数时会把当前工作目录添加到 sys.path 中,而不加时则会把脚本所在目录添加到 sys.path 中。
  • 加上 -m 参数时 Python 会先将模块或者包导入,然后再执行
  • __main__.py文件是一个包或者目录的入口程序。不管是用 python package 还是用python -m package 运行时,__main__.py文件总是被执行。

第五组:姜葳 JS刷新页面

1. 刷新当前页面

2. JS实现刷新iframe的方法
 

< input type="button" name="Button" value="Button" 
onclick="document.all.ifrmname.document.location.reload()">
3. 子页面刷新父页面
(1)parent.location.href = parent.location.reload();

(2) 

(或刷新 )
4.开窗时刷新和关闭时刷新
 开窗时刷新
 关闭时刷新
5. AlertPage弹出的窗口,关闭时刷新

代码:

function InvoiceDetail() {
           AlertPage("AmInvoiceDetails.aspx?isNeedVerify=no&Type=verify”, "发票详情", 900, 800);
           OpeningDialog.openingDialog.bind("close", function () {
               location.reload();
           })
       }

流水落花春去也,天上人间

你可能感兴趣的:(2017.11.15 表格的样式设定、AuguarJS服务和依赖注入、String 方法、_main__.py文件与 python -m、JS刷新页面)