如何更改文本框 (dijit/form/TextBox) 焦点颜色
How to Change TextBox (dijit/form/TextBox) Focus color
我试图创建扩展 dijit/form/TextBox 的 TextBoxEx。 TextBoxEx 覆盖 _onFocus(请参阅下面的代码)但 TextBox 不会更改背景颜色。它总是透明的。我有什么错?
define([
"dojo/_base/declare", // declare
"dijit/form/TextBox",
"dojo/on",
"dojo/_base/event",
"dojo/dom-style"
], function(declare, TextBox, on, event, domStyle) {
var widget = declare("common.TextBoxEx", [TextBox], {
inputLanguage : '',
focusColor : '#F5EC9B',
selectOnClick : true,
_onFocus: function(e){
try{
if(this.disabled || this.readOnly){ return; }
this.inherited(arguments);
this._updatePlaceHolder();
var evt = document.createEvent("Events");
if(this.inputLanguage == 'en'){
evt.initEvent ('switchToEng', true, false);
window.dispatchEvent(evt);
}
else if(this.inputLanguage == 'th'){
evt.initEvent('switchToThai', true, false);
window.dispatchEvent(evt);
}
var dom = this.focusNode;
var focusColor = this.focusColor;
setTimeout(function() {
dom.select();
domStyle.set(dom, 'background-color', focusColor);
}, 200);
}
catch(e){
console.log(e)
}
},
});
return widget;
});
您实际上不需要这样设置背景颜色。只需使用 css 即可:
.myTextBoxClass.dijitTextBox.dijitFocused .dijitInputInner {
background-color: gray;
}
只需将 .myTextBoxClass
更改为您输入文本框的 class。
使用 !important 以您自己的风格覆盖您的默认主题 CSS。这种类型的工作只能使用 CSS 来完成。
我试图创建扩展 dijit/form/TextBox 的 TextBoxEx。 TextBoxEx 覆盖 _onFocus(请参阅下面的代码)但 TextBox 不会更改背景颜色。它总是透明的。我有什么错?
define([
"dojo/_base/declare", // declare
"dijit/form/TextBox",
"dojo/on",
"dojo/_base/event",
"dojo/dom-style"
], function(declare, TextBox, on, event, domStyle) {
var widget = declare("common.TextBoxEx", [TextBox], {
inputLanguage : '',
focusColor : '#F5EC9B',
selectOnClick : true,
_onFocus: function(e){
try{
if(this.disabled || this.readOnly){ return; }
this.inherited(arguments);
this._updatePlaceHolder();
var evt = document.createEvent("Events");
if(this.inputLanguage == 'en'){
evt.initEvent ('switchToEng', true, false);
window.dispatchEvent(evt);
}
else if(this.inputLanguage == 'th'){
evt.initEvent('switchToThai', true, false);
window.dispatchEvent(evt);
}
var dom = this.focusNode;
var focusColor = this.focusColor;
setTimeout(function() {
dom.select();
domStyle.set(dom, 'background-color', focusColor);
}, 200);
}
catch(e){
console.log(e)
}
},
});
return widget;
});
您实际上不需要这样设置背景颜色。只需使用 css 即可:
.myTextBoxClass.dijitTextBox.dijitFocused .dijitInputInner {
background-color: gray;
}
只需将 .myTextBoxClass
更改为您输入文本框的 class。
使用 !important 以您自己的风格覆盖您的默认主题 CSS。这种类型的工作只能使用 CSS 来完成。