HI朋友我想创建一个可编辑的div,用户可以在文本达到div的定义高度时键入文本,当用户继续输入文本并再次达到定义的高度后,字体大小将减少到14px
除非直到他删除div中的一些文本,否则将会出现一个提示“停止输入”和用户无法输入的警报....我知道这个故事太长但我知道我可以在这里挑衅得到答案我已经尝试了一些你可以做的事情在下面找到,或者你可以看到这里的小提琴http://jsfiddle.net/JW4Qt/3/
SCRIPT
$('.divContent').keydown(function(e){
var heigh = $(this).height();
if (($(this).height()) > 200)
{
var font = $('.divContent').css('font-size');
font = parseInt(font);
$(this).css('font-size',''+font - 2+'px')
if(($(this).css('font-size')) <= '14px' && heigh > 200)
{
$(this).css('font-size','14px')
font = 14;
/*alert('stop')*/
}
}
})
HTML
<div class="divContent" contenteditable="true" autocomplete="off">
Start typing here</div>
先谢谢你们。:)
答案 0 :(得分:2)
你需要将条件分开并在第一个条件中传递另一个条件。
$('.divContent').keydown(function(e){
var heigh = $(this).height();
if (($(this).height()) > 200 && $(this).css('font-size') >= '16px')
{
var font = $('.divContent').css('font-size');
font = parseInt(font);
$(this).css('font-size',(font - 2) + 'px')
}
if(($(this).css('font-size')) <= '14px' && heigh > 230)
{
$("span").html("<b style='color:#f00'>STOP TYPING...</b>" );
$(this).css('font-size','14px')
font = 14;
if(e.keyCode==8)
{
$("span").html("<b style='color:#0f0'>START TYPING...</b>" );
return true;
}
else
{
return false;
}
}
})
请参阅此fiddle了解演示