Javascript似乎在改变表格字段样式

下面的表格用class="checkMax3"显示文本比它应该低几个像素。在Chrome中，小写“p”和“q”等字母延伸到字段底部以下。在IE 8中，这些相同字母的底部不显示。Javascript似乎在改变表格字段样式

如果我没有记错，这个问题在我将下面的Javascript应用到现场后开始了。

任何想法如何让它像“q”和“p”这样的字母完全适合该领域？该字段看起来足够高以容纳字母，但文字看起来像是在该字段中太低了约5个像素。

由于提前，

约翰

的JavaScript：

<script language="javascript" type="text/javascript" src="jquery-1.2.6.min.js"></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function() { 
    setMaxLength();  
    $("input.checkMax3").bind("click mouseover keyup change", function(){checkMaxLength(this.id); }) 
}); 
function setMaxLength() { 
    $("input.checkMax3").each(function(i){ 
     intMax = $(this).attr("maxlength"); 
     $(this).after("<div class='commchar2'><span id='"+this.id+"Counter'>"+intMax+"</span> characters remaining</div>"); 
     }); 
    } 
function checkMaxLength(strID){ 
     intCount = $("#"+strID).val().length; 
     intMax = $("#"+strID).attr("maxlength"); 
     strID = "#"+strID+"Counter"; 
     $(strID).text(parseInt(intMax) - parseInt(intCount)); 
     if (intCount < (intMax * .8)) {$(strID).css("color", "#006600"); } //good 
     if (intCount > (intMax * .8)) { $(strID).css("color", "#FF9933"); } //warning at 80% 
     if (intCount > (intMax)) { $(strID).text(0).css("color", "#990000"); } //over 
    } 
</script>

的PHP/HTML：

echo '<form action="http://www...com/.../submit2a.php" method="post"> 
    <input type="hidden" value="'.$_SESSION['loginid'].'" name="uid"> 

    <div class="submissiontitle"><label for="title">Story Title:</label></div> 
    <div class="submissionfield"><input class="checkMax3" name="title" type="title" id="title" maxlength="80"></div> 

    <div class="urltitle"><label for="url">Link:</label></div> 
    <div class="urlfield"><input name="url" type="text" id="url" maxlength="500"></div> 

    <div class="submissionbutton"><input name="submit" type="submit" value="Submit"></div> 
</form> 
';

的CSS：

.submissionfield 
    { 
    position:absolute; 
    width:550px; 
    left:30px; 
    top:230px; 
    text-align: left; 
    vertical-align:text-top; 
    margin-bottom:10px; 
    padding:2px; 
    font-family: "Times New Roman", Times, serif; 
    font-size: 22px; 
    line-height: 30px; 
    color:#000000; 
    }

来源

2010-08-16 John

约翰，你可能想考虑选择一个答案，如果这解决了你的问题。 – UpHelix 2010-09-10 23:24:46

字体太大或输入的高度和行高不够大。玩的高度和行高（使他们总是匹配）和字体大小，你将能够得到它。

编辑：

我看到你的问题。具有高度，字体大小和行高样式的类.submissionfield不是输入。这个班是在一个分区。将类似的样式应用于.checkMax3类，它应该看起来很好。

来源

2010-08-16 21:48:10 UpHelix

Javascript似乎在改变表格字段样式

回答

相关问题