1、效果
文本框中的文字可编辑,编辑完过后移开光标,编辑后的文字滚动
2、上代码
<body onload="Scroll()">
<input type="text" name="mainTextScroller" id="mainTextScroller" size="40" onfocus="stopScroll()" onblur="saveText()">
</body>
<script type="text/javascript">
<script type="text/javascript">
var savetext="我是最初的文本"
var currentText=""
var startPosition=0
var speed=300
var timer=0
function Scroll(){
document.getElementById("mainTextScroller").value=savetext//原来输入的
currentText=savetext//document.getElementById("mainTextScroller").value
TextScroller()
}
function stopScroll(){
//停下来编辑文本
document.getElementById("mainTextScroller").value=savetext//原来输入的
clearTimeout(timer)
// startPosition=0
}
function saveText(){
//编辑结束保存文本
savetext=document.getElementById("mainTextScroller").value//获取现在输入的
currentText=savetext//document.getElementById("mainTextScroller").value
TextScroller()
}
function TextScroller(){
var MainMsg=currentText
var scrollingRigion=MainMsg.length
var j=0
console.log(MainMsg)
for(var i=0;i<=j;i++){
document.getElementById("mainTextScroller").value=MainMsg.substring(startPosition,startPosition+scrollingRigion);
startPosition++;
if(startPosition>scrollingRigion){
startPosition=0
}
timer=setTimeout("TextScroller()",speed)
}
}
</script>