html - 只读状态下的Textarea文本显示未满

Question

问题 普通的

html

<textarea id="dataForm:DESCRIBE" name="dataForm:DESCRIBE"  
style="width:100% !important;height:120px !important; overflow: visible !important;"></textarea> 

CSS:

textarea {
    width: 100%;
    height: 48px;
    border: 1px solid #ddd; 
}

js代码(textarea只读):

if (value==true&&(otype=="text"||otype=="textarea"||otype=="select-one")){
  $(name).readOnly = true;
  $(name).onclick  = "";
  $(name).style.background="#F4F4F4";
  if (otype=="select-one"){
    $(name).disabled = value;
  }
}
else{
  $(name).disabled = value;
}

我们尝试标记高度 !important，但它不起作用。如果删除css样式

{ 
 width: 100%; 
 height: 48px;   
 border: 1px solid #ddd; 
}

它可以工作，但样式是浏览器默认的。

我的本​​地服务网页没有问题，但是web服务的生产环境不正常，不知为何，无法自己调试生产环境。

Answer 1

没有上下文，我不完全确定你在做什么，或者问题是什么。我在下面创建了一个工作示例，其中 jQuery 可以为文本区域或输入切换只读。希望对您有所帮助。

$("#toggle-readonly").click(function(){
  $textarea = $("textarea[name=dataForm\\:DESCRIBE]");
  
  if($textarea.attr("readonly") !== undefined){ 
    //This is the line thar really counts
    $("textarea[name=dataForm\\:DESCRIBE]").removeAttr('readonly')
  } else{
    $("textarea[name=dataForm\\:DESCRIBE]").attr('readonly','readonly');
  }
  
 
});

textarea {
    width: 100%;
    height: 48px;
    border: 1px solid #ddd; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="dataForm:DESCRIBE" name="dataForm:DESCRIBE">This is placeholder text...</textarea>

<button id="toggle-readonly">Toggle Readonly</button>