我正在尝试将使用内联事件处理程序的 JavaScript 函数更改为采用更现代方法的函数。我想从实际的 HTML 标记中删除丑陋的事件处理程序,并将其放入模块化的外部 javascript 文件中。这是测试用例:
这是当前的代码(就功能而言工作正常
function formatPhone(obj) {
var numbers = obj.value.replace(/\D/g, ''),
char = {0:'(',3:') ',6:' - '};
obj.value = '';
for (var i = 0; i < numbers.length; i++) {
obj.value += (char[i]||'') + numbers[i];
}
}
<小时/>
我想要完成的是这样的事情:
var TargetEl = $('[name="pnumb"]');
TargetEl.on('blur', function() {
var UserInput = $('[name="pnumb"]').value.replace(/\D/g, ''),
char = {0:'(',3:') ',6:' - '};
TargetEl.value = '';
for (var i = 0; i < UserInput.length; i++) {
TargetEl.value += (char[i]||'') + numbers[i];
}
我的主要重点是删除内联js和onblur =“”事件处理程序。我还希望在目标El模糊后格式化电话号码。最后,我希望通过简单地分配一个 .pnumbFormat 类来调用它...(提前感谢您的帮助!)
这是 fiddle ... http://jsfiddle.net/UberNerd/ae4fk/
最佳答案
修改您的函数以接受字符串并返回字符串。
function formatPhone(value) {
var numbers = value.replace(/\D/g, ''),
char = {
0: '(',
3: ') ',
6: ' - '
};
value = '';
for (var i = 0; i < numbers.length; i++) {
value += (char[i] || '') + numbers[i];
}
return value;
}
var TargetEl = $('[name="pnumb"]');
TargetEl.on('blur', function () {
$(this).val(formatPhone($(this).val()))
});
<小时/>
更好
感谢@KevinB 出色的即兴创作。
function formatPhone(_,value) {
var numbers = value.replace(/\D/g, ''),
char = {
0: '(',
3: ') ',
6: ' - '
};
value = '';
for (var i = 0; i < numbers.length; i++) {
value += (char[i] || '') + numbers[i];
}
return value;
}
var TargetEl = $('[name="pnumb"]');
TargetEl.on('blur', function () {
$(this).val(formatPhone)
});
关于javascript - 如何将此函数调用移出我的 HTML 代码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21636678/