我正在为我的 Web 应用程序构建一个“自定义”验证模块。我正在为我的所有复选框元素附加一个更改侦听器。当更改事件发生时,我检查是否需要输入 - 如果未检查元素,则元素验证失败。当我手动单击任何给定的复选框时,这工作得很好。工具提示按计划显示/销毁。
单击提交按钮时,我试图获得相同的功能。系统看到工具提示(应该)被渲染 - 但事实并非如此。这就像我需要触发一个点击事件,但如果我在一个复选框元素上这样做 - 该元素将被选中。不完全是任何用户想要的功能。我不确定如何在不点击任何内容的情况下通过点击。
如果任何给定元素无效,这是我如何调用我的工具:
验证.js
Tooltip.initialize($element, {'trigger': 'click', 'placement': 'bottom', 'title': Messages[$element.attr('name') + 'Required']});
这是初始化和显示任何给定工具提示的代码:
工具提示.js
initialize: function($element, options) {
(Tooltip.debug) ? console.log('-- initialize --') : null;
(Tooltip.debug) ? console.log('tooltip for: ' + $element.attr('name')) : null;
var that = this;
$('#' + $element.attr('name')).tooltip({
'placement': options.placement,
'title': options.title,
'trigger': options.trigger
}).on({
'blur': function() {
switch ($element.attr('type'))
{
case 'checkbox':
break;
case 'email':
that.show($element);
break;
case 'password':
that.show($element);
break;
case'tel':
that.show($element);
break;
case 'text':
that.show($element);
break;
default:
break;
}
},
'focus': function() {
that.destroy($element);
}
});
....
show: function($element) {
$('#' + $element.attr('id')).tooltip('show');
},
destroy: function($element) {
$('#' + $element.attr('id')).tooltip('destroy');
}
....