jquery - 在验证失败 jquerymobile 上更改阴影颜色

Question

在我的 jqm 应用程序中没有标准验证消息的空间。我尝试为无效的文本字段着色，但无法真正弄清楚如何解决以下问题：

如果验证失败并出现一些超时淡化效果，如何更改输入字段的 boxshadow？

就像是

var fieldIsValid = false;

//validation failed
if (!fieldIsValid) {
    var myinput = $('#myinput');

    myinput.removeClass('box-shadow');
    //and the webkit-box-shadow, how is this called in jqm?

    myinput.addClass('invalidShadowClass');

    setTimeout(function () {
        myinput.removeClass('invalidShadowClass');
        myinput.addClass('standardShadowClass'); //
    }, 3000);
}

我在主题 css 中找不到明确设置阴影颜色的部分，invalidShadowClass 的外观如何？

例如，是否有可能显示 invalidShadowClass 并在 3 秒后将其删除？

Answer 1

感谢@Omar，工作就像一个魅力

脚本

function StyleInvalidControl(control) {
    $(control).closest('div').addClass("invalidControl");

    setTimeout(function () {
        $(control).closest('div').removeClass('invalidControl');
    }, 3000);
}

风格

.invalidControl {
     -moz-box-shadow: inset 0px 0px 3px #99200F /*{global-active-background-color}*/, 0px 0px 9px #99200F/*{global-active-background-color}*/ !important;
     -webkit-box-shadow: inset 0px 0px 3px #99200F /*{global-active-background-color}*/, 0px 0px 9px #99200F /*{global-active-background-color}*/ !important;
     box-shadow: inset 0px 0px 3px #99200F /*{global-active-background-color}*/, 0px 0px 9px #99200F /*{global-active-background-color}*/ !important;
}