js可以滑動的文本框,html滾動文本框

本文目錄一覽：

• 1、你好，我想請問js動態添加文本以及文本框該怎麼實現，我不想用表格做
• 2、請問哪位高手知道如何用Javascript實現文本框內的文字水平滾動
• 3、JS/JAVASCRIPT 選中文本框內的文字 讓滾動條滾動到選中文字的位置
• 4、JS怎樣實現用按鈕控制textarea文本框的游標按行移動
• 5、怎樣用javascript實現頁面滾動到指定的控制項

你好，我想請問js動態添加文本以及文本框該怎麼實現，我不想用表格做

用easyUI屬性

columns:[[

{field:’b’,title:’修改’,width:190,formatter:function(row){

return ‘input id=”sage” name =”age”‘;

}

]]

可以實現動態每列自動生成文本框，希望採納。

請問哪位高手知道如何用Javascript實現文本框內的文字水平滾動

要完成此效果把如下代碼加入到body區域中

SCRIPT language=”javascript”

var scroll = true;

var num = 0;

function scrollStatus() {

var statusText = “”;

var statusChars = new Array( ‘t’,’y’,’p’,’h’,’o’,’o’,’n’,’ ‘,’s’,’t’,’a’,’r’,’t’);

for (var l = 0; l 1; l++) {

for (var a = num; a statusChars.length; a++)

statusText += statusChars[a];

for (var b = 0; b num; b++)

statusText += statusChars[b];

}

window.status = statusText;

num++;

if (num = statusChars.length)

num = 0;

if (scroll) {

setTimeout(“scrollStatus()”,100);

}

}

scrollStatus();

/SCRIPT

form name=”form1″

input name=”stopIt” type=”text” value=”Stop Scrolling”

onClick=” if (scroll == false)

scroll = true;

else

scroll = false;

scrollStatus();

scrollButton();

“

/form

SCRIPT language=”javascript”

var num = 0;

scrollButton();

function scrollButton() {

var buttonChars = new Array(‘S’, ‘t’, ‘o’, ‘p’, ‘ ‘, ‘S’, ‘c’, ‘r’, ‘o’, ‘l’, ‘l’, ‘i’,

‘n’, ‘g’, ‘ ‘, ‘ ‘);

var buttonText = “”;

for (var a = num; a buttonChars.length; a++)

buttonText += buttonChars[a];

for (var b = 0; b num; b++)

buttonText += buttonChars[b];

num++;

if (num = buttonChars.length)

num = 0;

document.form1.stopIt.value = buttonText;

if (scroll) {

setTimeout(“scrollButton();”, 100);

}

}

/SCRIPT

JS/JAVASCRIPT 選中文本框內的文字 讓滾動條滾動到選中文字的位置

function func(){

var textarea = document.getElementById(“textarea”);

//首先移動游標到所選文字位置，滾動條自動滾動

MoveCursortoPos(‘textarea’ , 30 );

//再選中文字

textarea.setSelectionRange(30,32);//選中文本框內的文字

//textarea.scrollTop = textarea.scrollHeight;//滾動到底部

//想要修改成只滾動到 選中文字 的位置應該怎麼寫？

}

//設置游標位置

function MoveCursortoPos(id,pos){//定位游標到某個位置

var obj = document.getElementById(id); //獲得元素

pos = pos ?pos :obj.value.length;

if (obj.createTextRange) {//IE瀏覽器 IE瀏覽器中有TextRange 對body,textarea,button有效

var range = obj.createTextRange(); //創建textRange

range.moveStart(“character”, pos); //移動開始點，以字元為單位

range.collapse(true);//沒有移動結束點直接 摺疊到一個點

range.select();//選擇這個點

} else {//非IE瀏覽器

obj.setSelectionRange(obj.value.length, pos);

}

obj.focus();

}

JS怎樣實現用按鈕控制textarea文本框的游標按行移動

這個實現比較麻煩，

首先得判斷內容是一行還是多行，如果是多行，那麼就把游標往下移

方法是從游標位置往後搜索換行符，然後把游標移到換行符後面去

如果游標位置後面沒有換行符，得插入換行符？

找到游標位置和移動游標的方法就不用展開了， createTextRange方法，去看一下文檔吧

怎樣用javascript實現頁面滾動到指定的控制項

HTML

HEAD

!– 滾動區域坐標大小定位–

STYLE type=text/css

#divContainer {

CLIP: rect(0px 294px 20px 0px); HEIGHT: 20px; LEFT: 0px; OVERFLOW: hidden; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; WIDTH: 294px

}

#divContent {

LEFT: 0px; POSITION: absolute; TOP: 0px

}

/STYLE

SCRIPT language=JavaScript

// 滾動開始

function verifyCompatibleBrowser(){

this.ver=navigator.appVersion

this.dom=document.getElementById?1:0

this.ie5=(this.ver.indexOf(“MSIE 5”)-1 this.dom)?1:0;

this.ie4=(document.all !this.dom)?1:0;

this.ns5=(this.dom parseInt(this.ver) = 5) ?1:0;

this.ns4=(document.layers !this.dom)?1:0;

this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)

return this

}

bw=new verifyCompatibleBrowser()

var speed=0

var loop, timer

function ConstructObject(obj,nest){

nest=(!nest) ? ”:’document.’+nest+’.’;

this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+’document.’+obj):0;

this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+’document.’+obj):0;

//內容寬度

this.scrollWidth=bw.ns4?this.css.document.width:this.el.offsetWidth;

//顯示區域寬度

this.clipWidth=bw.ns4?this.css.clip.width:this.el.offsetWidth;

this.left=MoveAreaLeft;

this.right=MoveAreaRight;

this.MoveArea=MoveArea; this.x; this.y;

this.obj = obj + “Object”;

eval(this.obj + “=this”);

return this;

}

function MoveArea(x,y){

this.x=x;this.y=y

this.css.left=this.x

this.css.top=this.y

}

function MoveAreaRight(move){

//alert(“this.scrollWidth=”+this.scrollWidth+” objContainer.clipWidth=”+objContainer.clipWidth+”\n”+” objContainer.clipWidth-this.scrollWidth=”+(objContainer.clipWidth-this.scrollWidth)+”\n”+”this.x=”+this.x);

document.getElementById(“previous”).style.display = “block”;

document.getElementById(“previousq”).style.display = “block”;

if(this.xobjContainer.clipWidth-this.scrollWidth){

this.MoveArea(this.x-move,0)

if(loop) setTimeout(this.obj+”.right(“+move+”)”,speed)

}

else{

document.getElementById(“next”).style.display = “none”;

document.getElementById(“nextq”).style.display = “none”;

}

}

function MoveAreaLeft(move){

document.getElementById(“next”).style.display = “block”;

document.getElementById(“nextq”).style.display = “block”;

if(this.x0){

this.MoveArea(this.x-move,0)

if(loop) setTimeout(this.obj+”.left(“+move+”)”,speed)

}

else{

document.getElementById(“previous”).style.display = “none”;

document.getElementById(“previousq”).style.display = “none”;

}

}

//滾動方法

function PerformScroll(speed){

if(initialised){

loop=true;

if(speed0) objScroller.right(speed)

else objScroller.left(speed)

}

}

//停止滾動方法

function CeaseScroll(){

loop=false

if(timer) clearTimeout(timer)

}

//初始化

var initialised;

function InitialiseScrollableArea(){

objContainer=new ConstructObject(‘divContainer’)

objScroller=new ConstructObject(‘divContent’,’divContainer’)

objScroller.MoveArea(0,0)

objContainer.css.visibility=’visible’

initialised=true;

if(objScroller.scrollWidthobjContainer.clipWidth){

document.getElementById(“previous”).style.display = “none”;

document.getElementById(“next”).style.display = “block”;

document.getElementById(“previousq”).style.display = “none”;

document.getElementById(“nextq”).style.display = “block”;

}

}

// 滾動結束

/SCRIPT

/HEAD

BODY onload=InitialiseScrollableArea()

TABLE border=0 cellPadding=0 cellSpacing=0 height=300 width=360

TBODY

TR

TD background=ckh.files/a_r1_c2.jpg

!–滾動區域開始–

DIV id=divContainer style=”LEFT: 50px; TOP: 50px; VISIBILITY: visible”

DIV id=divContent

nobr

但一天過去了我始終沒有找到合適的配色方案但一天過去了但一天過去了我始終沒有找到合適的配色方案但一天過去了但一天過去了我始終沒有找到合適的配色方案但一天過去了但一天過去了我始終沒有找到合適的配色方案但一天過去了

/nobr

/DIV

/DIV

!–滾動區域結束 —

/TD

/TR

!–滾動按鈕開始 —

tr

td id=starttd

DIV id=”previousq”

A href=”javascript:;” onmouseout=CeaseScroll() onmouseover=PerformScroll(-200)

快進左

/A

/DIV

brbr

DIV id=”previous”

A href=”javascript:;” onmouseout=CeaseScroll() onmouseover=PerformScroll(-3)

向左

/A

/DIV

/td

td

DIV id=”next”

A href=”javascript:;” onmouseout=CeaseScroll() onmouseover=PerformScroll(3)

向右

/A

/DIV

brbr

DIV id=”nextq”

A href=”javascript:;” onmouseout=CeaseScroll() onmouseover=PerformScroll(200)

快進右

/A

/DIV

/td

/tr

!–滾動按鈕結束 —

/TBODY

/TABLE

/BODY

/HTML