效果圖:
具體實現:
1、textarea標籤內容
複製代碼 代碼如下:
備註: td>
2、初始化讓點擊新增按鈕時,內容顯示最多能輸入50個字
複製程式碼 程式碼如下:
$("#introduction").val("最多能輸入50個字");
document.getElementById("introduction").style.color=" gray";
3、js腳本
複製程式碼 程式碼如下:
function getAddFocus(id){//針對添加操作中的簡介和備註,textarea獲得焦點清空輸入框
var textarea= document.getElementById(id);
textarea.value="";
textarea.style.color="black";
}
function lostAddFocus(id){//針對添加操作中的簡介和備註,textarea失去焦點且內容為空時,顯示提示訊息
var textarea=document.getElementById(id);
var textarea_value=textarea.value;
if(textarea_value== ""){
textarea.value="最多能輸入50個字";
textarea.style.color="gray";
}
}
csdn小夥伴寫的textarea焦點的用法參考:
複製程式碼 程式碼如下:
1.文字方塊顯示預設文字:
2.滑鼠點擊文字框,預設文字消失:
3.滑鼠移至文本框,預設文字消失:
4.滑鼠點選文字框,預設文字消失,點擊文字方塊外任意區域,預設文字又重現:
5.滑鼠移至文字框,預設文字消失,滑鼠移出文字框,預設文字再重現:
6.滑鼠點選文字框,文字框內任何文字消失(包括預設文字及後來輸入的文字):
7.滑鼠移至文字框,文字框內任何文字消失(包括預設文字及後來輸入的文字):
8.擊文字方塊後全選文字方塊內的文字:
9.滑鼠移至文字方塊全選文字方塊內的文字: