IE7输入:焦点

Question

我有以下CSS在IE7中不起作用.

input:focus{border-width: 2px;border-color: Blue; border-style: solid;}

基本上,我只想在输入聚焦时设置边框属性.适用于Firefox等...如果有人能解释为什么它不能在IE 7中工作并建议一个可能的解决方法,我们将不胜感激.谢谢.

Answer 1

我理解不想添加事件的愿望,但在这种情况下,看起来MSIE7在这一点上是混蛋,需要被黑客攻击.在你对@ Ape-in​​ago的评论中,你表明你正在使用jQuery.这是jQuery的解决方案.我在MSIE 6和7中对此进行了测试,它似乎可以满足您的需求.

<script type="text/javascript">
$(document).ready(function(){
    if (jQuery.browser.msie === true) {
        jQuery('input')
            .bind('focus', function() {
                $(this).addClass('ieFocusHack');
            }).bind('blur', function() {
                $(this).removeClass('ieFocusHack');
            });
    }

});
</script>
<style>
input:focus, input.ieFocusHack
{
    border-width: 2px;
    border-color: Blue;
    border-style: solid;
}
</style>

Answer 2

这个问题的一个已知答案是使用以下代码:

    sfFocus = function() {
    var sfEls = document.getElementsByTagName("INPUT");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onfocus=function() {
            this.className+=" sffocus";
        }
        sfEls[i].onblur=function() {
            this.className=this.className.replace(new RegExp(" sffocus\\b"), "");
        }
    }}
if (window.attachEvent) window.attachEvent("onload", sfFocus);

这是css风格

input:focus, input.sffocus{background-color:#DEEFFF;}

问题是IE根本不承认这种风格.

编辑:你可以在这里找到一个使用原型的解决方案:http://codesnippets.joyent.com/posts/show/1837