在Firefox 23中的表单文本框中缺少光标

时间:2013-08-20 08:55:18

标签: css forms firefox cross-browser css3

我在Firefox上遇到问题,我在表单中的文本框中看不到光标。这可以在Firefox 22上看到,因为我今天早上升级了23.0.1。

这在Chrome或IE中不会发生,并且似乎是特定于Firefox的问题,但是通过从Firebug中的表单字段中删除样式,我似乎无法将其缩小范围。

我的一个表单字段:

<input type="text" autocomplete="off" value="" id="CardNum" name="CardNum" class="textbox">

适用于该表单字段的CSS:

.input_box_shadow, .standard_form textarea, .standard_input, .standard_form input {
    background: -moz-linear-gradient(90deg, #EDECEC, #DDDDDD) repeat scroll 0 0 border-box #F4F4F0;
    border: 1px solid transparent;
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 0 3px white, 0 0 12px #F4F4F0 inset, -999px 0 0 #F4F4F0 inset;
    outline: medium none;
    transition: all 0.2s linear 0s;
}
.standard_input, .standard_form input {
    color: #434242;
    font-size: 1.05rem;
    height: 22px;
    letter-spacing: 0.1rem;
    padding-left: 5px;
    width: 230px;
}
button, input {
    line-height: normal;
}
button, input, select, textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
}

1 个答案:

答案 0 :(得分:0)

我已将此追溯到我的代码,以下是罪魁祸首。

$('form').on('focus','li', function(event) {
    if($(this).closest('form').attr('id') == 'oform'){
       return false;
    }
    $(this).closest('form').find('li').css('zIndex', '0');
    $(this).css('zIndex', 1998);
});

我为return false;更改了event.preventBubble = true;,这解决了Firefox的问题。