LoginSignup
0
0

More than 5 years have passed since last update.

テキストエリアなどで入力された行数が増えてエリアの高さを超えたときに警告するサンプル

Posted at
// 縦スクロールバーが出たら赤枠にする
function attachScrollbarCheck(ele) {            
    ele.cssTextOrg = ele.style.cssText;     
    ele.attachEvent("oninput", function(){      
        console.log(ele.scrollHeight > ele.clientHeight);   
        if (ele.scrollHeight > ele.clientHeight) {  
            ele.style.cssText = ele.cssTextOrg + ' border-color: red !important;';
        } else {    
            ele.style.cssText = ele.cssTextOrg;
        }   
    });     
}

// 改行個数がオーバーしたら赤枠にする
function attachNLCountCheck(ele, limitCount) {          
    ele.cssTextOrg = ele.style.cssText;     
    ele.attachEvent("oninput", function(){      
        console.log((ele.value.match(/\n|\r|\r\n|\n\r/g)||[]).length);  
        if ((ele.value.match(/\n|\r|\r\n|\n\r/g)||[]).length > limitCount) {    
            ele.style.cssText = ele.cssTextOrg + ' border-color: red !important;';
        } else {    
            ele.style.cssText = ele.cssTextOrg;
        }   
    });     
}           
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0