JavaScript – 微风的网络日志

JavaScript 避免 Ajax Get 方法因缓存而返回错误数据结果的问题

代码与范例：

$.get({
        url: GetUrl,
        // 方法1 - 使用 POST 方法
        type: 'POST',
        // 方法2 - 禁用 cache
        cache: false,
        // 方法3 - 修改参数
        dataType: 'json'?id=+Math.random(),
        data: {
            Id: parameterId
        }
    }).done(function (data) {
    });
}

$.get({

url: GetUrl,

// 方法1 - 使用 POST 方法

type: 'POST',

// 方法2 - 禁用 cache

cache: false,

// 方法3 - 修改参数

dataType: 'json'?id=+Math.random(),

data: {

Id: parameterId

}

}).done(function (data) {

});

}

方法4 – 页面 meta tag

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>

说明：Ajax 调用存在缓存，再次以相同参数调用时可能会直接调取先前结果，造成结果错误。可以用以上四种方式回避该问题。

在 Windows 下安装与配置 Karma

1. 安装 Karma 与相关插件

npm install karma --save-dev
npm install karma-jasmine karma-chrome-launcher --save-dev
npm install -g karma-cli

npm install karma --save-dev

npm install karma-jasmine karma-chrome-launcher --save-dev

npm install -g karma-cli

karma 与 karma-chrome-launcher 将被安装至当前工作目录下的 node_modules 并以 devDependencies 形式保存于 package.json。这样一来，其他开发者只需通过 npm install 来获取这些已经安装的依赖。之后，通过 -g 指定在全局安装 CLI 以实现命令行操作。

2. 创建配置文件
在项目的测试用例文件夹下执行以下命令

C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd init

1	C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd init

3. 启动 Karma

C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd start {配置文件路径}

1	C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd start {配置文件路径}

或在配置文件路径下执行

karma start karma.conf.js

1	karma start karma.conf.js

4. 终止 Karma

C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd stop

1	C:\Users\{UserName}\AppData\Roaming\npm\karma.cmd stop

AngularJS 中为 input 添加字母大小写不敏感正则表达式匹配验证

代码与范例：

$scope.domainList = 'domain1.com|domain2.com';

$scope.isEmailValid = function () {
    var domains = $scope.domainList;
    // 第二个参数用于设定大小写不敏感
    var re = new RegExp("^[a-zA-Z0-9._%+-]+@(" + domains + ")$", "i");
    // 获取 input 关联的 ng-Model 的文本内容
    var email = $scope.userLoginForm.userEmail.$modelValue;
    // 如果尚未输入任何内容，则默认通过验证，否则测试匹配正则表达式
    return re.test(email) || !$scope.userLoginForm.userEmail.$dirty;
                
}

$scope.domainList = 'domain1.com|domain2.com';

$scope.isEmailValid = function () {

var domains = $scope.domainList;

// 第二个参数用于设定大小写不敏感

var re = new RegExp("^[a-zA-Z0-9._%+-]+@(" + domains + ")$", "i");

// 获取 input 关联的 ng-Model 的文本内容

var email = $scope.userLoginForm.userEmail.$modelValue;

// 如果尚未输入任何内容，则默认通过验证，否则测试匹配正则表达式

return re.test(email) || !$scope.userLoginForm.userEmail.$dirty;

}

说明：虽然包括 JavaScript 在内的正则表达式实现支持大小写不敏感匹配（i），但 HTML5 中，input 元素的 pattern 属性并不支持该标记位。为此，要实现该功能，必须借助额外的逻辑。如需显示错误信息，可为错误信息添加 ng-show=‘!isEmailValid’ 属性。

JavaScript 中判断哪个链接（a 标签）被点击

代码与范例：

$(document).on("click", "a", function () {
    var href = $(this).attr("href");
    console.log("Clicked href: " + href);
});

$(document).on("click", "a", function () {

var href = $(this).attr("href");

console.log("Clicked href: " + href);

});

说明：可通过 callback 回调方法或许当前被点击的 a 标签，进一步得到诸如 href 或 title 等元素属性，就能知道用于点击了哪一个链接。此处的 a 标签也可以替换为其他包含 click 事件的元素。