2011-10-27 168 views
0

我试图水平对齐inputimg元素在特定的div。我给了input元素一个CSS属性display:block,但我的Firebug显示其显示属性为none输入字段不显示

关于CSS

.block_feedback .field input { 
    color: #FFF; 
    width:375px; 
    height:17px; line-height:17px; 
    margin-left:15px; margin-top:6px; 
    display:block; 
    background-color:transparent; 
    border:0px; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:16px; 
    float:left; 
} 
.block_feedback .field img { 
    color:#F00; 
    width:27px; 
    height:27px; line-height:25px; 
    margin-left:405px; margin-top:0px; 
    display:block; 
    background-color:transparent; 
    border:0px; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:16px; 
    font-weight:bold; 
    font-weight:bold; 
    float:left; 
} 

HTML

<div class="field"> 
    <input type="text" name="name" class="w_def_text" title="Name*" /> 
    <img width="27" height="27" src="images/error.jpg" alt="Error"> 
</div> 

萤火虫被示出作为

<input class="w_def_text" type="password" title="Password*" name="password" style="display: none;">jQuery1510542302776850034=Object { olddisplay="block"} 
<img width="27" height="27" alt="Error" src="images/error.jpg" style="display: block;"> 
<span style="display: none;">Password*</span>jQuery1510542302776850034=Object { olddisplay="block"} 

jQuery的

function init_fields() { 
$('.w_def_text').each(function() { 
    var text = $(this).attr('title'); 
    var html = '<span>' + text + '</span>'; 
    $(this).parent().append(html); 

    if($(this).val() == '') { 
     $(this).hide(); 
     $(this).next().show(); 
    } 
    else { 
     $(this).css({'display' : 'block'}); 
     $(this).next().hide(); 
    } 
}); 

$('.w_def_text').live('blur', function() { 
    if($(this).val() == '') { 
     $(this).hide(); 
     $(this).next().show(); 
    } 
}); 

$('.w_def_text ~ span').live('click', function() { 
    $(this).hide(); 
    $(this).prev().css({'display' : 'block'}).focus(); 
}); 
} 
+0

看起来好像jQuery隐藏它。分享你的JavaScript? – kojiro

+0

这里的firebug示例中的jquery位似乎表明你已经在某个地方玩了一些JS,在背后使用css。 –

+0

@Marc,但我不认为我的jQuery正在修改任何显示属性。 –

回答

0

我不完全确定你想要达到什么目标,但根据你的问题标题和简要描述,似乎你根本不知道为什么你的输入元素被隐藏,或者为什么它在Firebug中是display: none

它似乎很清楚,它将被.hide()方法更改为您的jQuery代码中的display: none

作为每jQuery documention

没有参数,所述.hide()方法是隐藏的元件的最简单的方法:

$('.target').hide();

匹配的元素将是 立即隐藏,以没有动画。 这大致相当于 调用.css('display', 'none')

没有看到你的HTML标记的其余部分或知道脚本的目的,很难说哪一行包含.hide()原因造成的。只需禁用JavaScript即可证明jQuery代码是根本原因。