代码之家 › 专栏 › 技术社区 › user28928120

在textarea中选择文本,通过packspace/delete删除它,为另一个元素添加css

text select jquery javascript

-1

user28928120 · 技术社区 · 7 月前

我有一个div和textarea。

我想要两样东西:

1-如果我选择文本区域中的所有文本, 然后按退格键或删除键, 这将为div添加css 1px实心红色边框。这意味着:在删除之前,检测**所有**文本是否被选中。

2-如果不是选择所有文本,而只是**长**,请按退格键或删除键要删除所有文本,这将向div添加css 1px实心红色边框。 如果短按且所有文本未被删除,我不想在这里添加css . 长按并删除所有文本后,添加css。

这是我的代码:

<div id="getcss">html contents</div>
<textarea name="new" id="message">text content</textarea>


<script>                                            
$('#message').keyup(function(e){
if (e.keyCode == 8 || e.keyCode == 46){
// code 1-
// if select all the text in textarea 
// then press on backspace or delete 
// will add 1px solid red border to div id="getcss" .
// code 2-  
// if text not selected in textarea 
// and press on backspace or delete 
// and still press untill delete all the text  
// will add 1px solid red border to div id="getcss" .
}
});

</script>

1 回复 | 直到 7 月前

Death-is-the-real-truth 7 月前

如果您对完全删除或未删除的文本区域数据进行检查,您的两种情况都将得到保障

根据检查,在div上应用一个类,并为该类编写所需的css。

工作片段:

$('#message').keyup(function(e) {
  if (e.keyCode == 8 || e.keyCode == 46) {
    if ($(this).val().length == 0) {
      $('#getcss').addClass('bordered');
    }
  }
});

.bordered {
  border: 1px solid red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div id="getcss">html contents</div>
<br><br>
<textarea name="new" id="message">text content</textarea>