如何在 IE7 中更改输入框的样式？答案

【问题标题】：How do I change the style of an input box in IE7 on focus?如何在 IE7 中更改输入框的样式？
【发布时间】：2010-07-17 08:10:27
【问题描述】：

我知道 IE7 有问题...

我在这里和 Google 上阅读过帖子，告诉我我需要手动设置样式 onfocus() 和 onblur()。但是，我尝试的一切都不起作用！

这是我的 jQuery

    $(document).ready(function(){                       

        if (jQuery.browser.msie === true) {

        $("input.date-picker").each(function(i) 
            {
                var $foo= $(this);
                $foo.bind('onfocus onblur', function() {
                    $(this).toggleClass('smalltxt-active');
                    });

            });                

            }//end if


     });

一个对应的框

<input name="ctl00$SelectionContent$Selections1$txtDestinationDate" type="text"
id="ctl00_SelectionContent_Selections1_txtDestinationDate" class="date-picker" 
style="width:80px;" />

我已经确认我的代码正在检测 MSIE。我得到了 2 个 input.date-picker 对象的计数。

有什么想法吗？

提前致谢，

【问题讨论】：

标签： asp.net jquery css internet-explorer-7

【解决方案1】：

$foo.bind('onfocus onblur', function() {

应该是

$foo.bind('focus blur', function() {

你真的不需要每个循环，

$("input.date-picker").bind('focusin focusout', function(){
  $(this).toggleClass('smalltxt-active');
}

刚刚好。它将选择所有具有“日期选择器”类的输入元素并将事件绑定到它。您可能还想了解.focusin() 和.focusout() 事件。

【讨论】：

感谢您的快速回答！ .bind() 是否将代码添加到这些事件的输入元素？即使有这种变化，它也不起作用。而且我也没有看到添加任何标记（不确定我是否应该这样做）
已更新。 .bind() 仅调用绑定您的自定义代码的事件处理程序方法。如果一切正常，您可以使用 FireBug 来观察类 smalltxt-active 的切换。

【解决方案2】：

对许多表单元素试试这个

$("input,select,button").bind('focusin focusout', function(){ $(this).toggleClass('focu'); });

【讨论】：