使用div调整文本区大小

如何在调整其中的textarea大小时调整div的大小？使用div调整文本区大小
如果我创建两个或两个以上的粘性，并使用ESC所有粘性将被关闭。如何设置ESC来关闭只有活动的弹出窗口？
页面刷新时如何保持粘性？

我用这个代码，以弹出便条：http://codepen.io/anon/pen/XXNBoz

<script type="text/javascript" src="https://code.jquery.com/jquery-1.7.2.js"></script> 
    <script type="text/javascript" src="https://code.jquery.com/ui/1.8.18/jquery-ui.js"></script> 
    <script> 

     $(document).ready(function(){ 
     function limitTextareaLine(e) { 
         if(e.keyCode == 13 && $(this).val().split("\n").length >= $(this).attr('rows')) { 
          return false; 
         } 
        } 
        $(function() { 
         $('textarea.limited').keydown(limitTextareaLine); 
        });  
        var x = "<div class='darkYellow'><div class='close'>X</div>Note<div class='lightYellow'><textarea maxlength='250' rows='8' cols='25' class='limited'></textarea></div></div>";  
        $('#click').click(function() { 
         $('#one').append('<div class="note">'+x+'</div>'); 
         $(".darkYellow").draggable(); 
         $('.close').each(function(){ 
          $('.close').click(function() { 
           $(this).parent().remove(); 
          }); 
         }); 
        }); 
        $('.darkYellow').live('click', function() { 
         $(this).addClass("index"); 
        }); 
        $('.darkYellow').live('blur', function() { 
         $(this).removeClass("index"); 
        }); 
      $(document).keyup(function(e) { 
       if (e.keyCode == 27) { 
        window.open(location, '_self', ''); 
        openedWindow.close(); 
       } 
      }); 
     });

enter image description here

来源

2015-12-30 TheMan

现在，我们所能做的是猜测，那么请张贴最低工作的代码片段，以获得最佳的答案。 – LGSon

我可以建议你为你的可拖动'div'添加一个调整大小的函数，并让'textarea'适应这个。这种方式即使浏览器没有'textarea'调整大小句柄将可调整大小。 – LGSon

这里是新的实际工作代码：http://codepen.io/anon/pen/XXNBoz – TheMan

将固定宽度和高度更改为最小宽度和最小高度，如下所示。

它应该自动调整大小。

*{ 
    margin:auto; 
    padding:0; 
} 

.darkYellow { 
    position:absolute; 
    background-color: #76B5F0; 
    min-width:200px; 
    min-height:150px; 
    font-size:12px; 
    text-indent:1px; 
    -webkit-box-shadow: 1px 1px 10px #888888; 
    cursor:move 
    } 

.lightYellow {  
    min-width:200px; 
    min-height:135px; 
    background-color: #8EC0EE; 
    margin-top:1px; 
} 

textarea { 
background-color: #8EC0EE;  
border: 0px; 
} 

.index { 
z-index: 55;  
} 

.close { 
width:7px; 
height:7px; 
padding:0; 
line-height:2pt; 
float:right; 
margin-top:6px; 
margin-right:4px; 
font-size:14px; 
cursor:pointer; 
}

还使用了更新版本的JQuery，我已经更新了下面的小提琴。

https://jsfiddle.net/link2twenty/gLrmgqgz/10/

来源

2015-12-30 13:19:33

非常感谢你！现在我必须尝试找到解决方案，使一个“活着的会话”对于页面刷新时的任何粘性。 – TheMan

在CSS设置父div的显示屏显示：表中应该解决的问题并在更改textarea的大小时调整它的大小。

编辑：至于转义的事情（只是刷新，看到了），你可以使用document.activeElement或因为你使用jQuery你可以做$（'：焦点'）。

编辑：把你的openWindow变量设置为openWindow = $(':focus');，至于你添加的第三项你必须将活动粘贴保存在页面的本地存储中，并且每次更改粘贴处于活动状态时更新它。这里有localStorage的一些信息localstorage MDN

来源

2015-12-30 11:22:36 NinjaMagii

您可以捕捉使用jQuery

$("textarea").resizable({ 
    resize: function() { 
     //resize your div 
    } 
});

对于即时贴的调整大小调整大小事件：你怎么定义变量openedWindow？

来源

2015-12-30 11:23:24

我不知道:-( – TheMan

使用div调整文本区大小

回答

相关问题