有个比较奇葩的需求。。就是在鼠标未选中textarea时文本框内会有一行灰色的提示语。这个很简单,用和value,placeholder什么的就能实现了。但是点击选中textarea也就是开始输入内容时,textarea内要有一行默认填入的内容。。没有图,我就用格式来解释一下。【#我是默认标题#我是placeholder】-->未选中textarea之前它显示的内容。【#我是默认标题#】-->选中textarea后文本框内的内容,placeholder消失但是默认标题保留。请问这样的功能要怎么样实现?
2 回答
慕莱坞森
TA贡献1810条经验 获得超4个赞
#html
#jsangular.module('app',[]).controller('DemoCtrl',function($scope){vardefaultTitle='#我是默认标题#';vardefaultPlaceholder='我是placeholder';$scope.placeholder=defaultTitle+''+defaultPlaceholder;$scope.content='';$scope.focus=function(){if(!$scope.content){$scope.content=defaultTitle;}};$scope.blur=function(){if($scope.content===defaultTitle){$scope.content='';}};})
侃侃无极
TA贡献2051条经验 获得超10个赞
感觉你这个问题还是做成指令比较好,下面就是我的基本实现吧。html
varapp=angular.module('app',[]);app.directive('myTextarea',function(){return{require:'ngModel',link:function(scope,ele,attrs,modelController){vartext=attrs.myTextarea;varplaceholder=attrs.placeholder;varalltext=text+''+placeholder;ele.attr('placeholder',alltext);ele.on('focus',function(){if(!modelController.$modelValue){setVal(text);}});ele.on('blur',function(){if(modelController.$modelValue===text){setVal('');}});functionsetVal(v){modelController.$setViewValue(v);modelController.$render();}}}});app.controller('main',['$scope',function($scope){$scope.log=function(){console.log($scope.myText)}}]);基本思路就是通过model的controller来操控。