请问 jquery中这样可以在文本框多次添加内容?

请问 jquery中这样可以在文本框多次添加内容?,第1张

//这是获取文本光标位置的jquery插件

<script type="text/javascript">

$.fn.extend({

getposition:function( value ){

var elem = this[0]

if (elem&&(elem.tagName=="TEXTAREA"||elem.type.toLowerCase()=="text")) {

if($.browser.msie){

var rng

if(elem.tagName == "TEXTAREA"){

rng = event.srcElement.createTextRange()

rng.moveToPoint(event.x,event.y)

}else{

rng = document.selection.createRange()

}

if( value === undefined ){

rng.moveStart("character",-event.srcElement.value.length)

return rng.text.length

}else if(typeof value === "number" ){

var index=this.position()

index>value?( rng.moveEnd("character",value-index)):(rng.moveStart("character",value-index))

rng.select()

}

}else{

if( value === undefined ){

return elem.selectionStart

}else if(typeof value === "number" ){

elem.selectionEnd = value

elem.selectionStart = value

}

}

}else{

if( value === undefined )

return undefined

}

}

})

</script>

// jquery代码

<script language="JavaScript" type="text/javascript">

$(function(){

$(".text").blur(function(){

$(this).attr('num',$(this).getposition()) //文本框失去焦点时给自定义属性num赋值,用来获取光标位置

})

$(".btn").click(function(){

var num = $(".text").attr("num")//获得光标位置

var text = $(".text").val()//文本值

if(num === undefined)//判断文本框是否以获取焦点,如果没有获取就插入到最后

num = text.length

var text1 = text.substring(0,num)//获得光标前面的文本

var text2 = text.substring(num,text.length)//获得光标后面的文本

var newtext = text1 + $(this).val() + text2//与按钮值拼成新的字符串

$(".text").val(newtext)//给文本框赋值

$(".text").focus()//文本框获取焦点

num = Number(num) + Number($(this).val().length)

$(".text").getposition(num)//重新设置光标位置

})

})

</script>

//html 代码

<body>

<input type="text" class="text" value="我是文本框原来的值"/>

<input name="" class="btn" value="btn1" type="button" />

<input name="" class="btn" value="btn2" type="button" />

</body>

可能还有不足,你完善一下吧

<div id="div1">

<p id="p1">这是一个段落。</p>

<p id="p2">这是另一个段落。</p>

</div>

<script>

var para=document.createElement("p")

var node=document.createTextNode("这是一个新段落。")

para.appendChild(node)

var element=document.getElementById("div1")

element.appendChild(para)

</script>

这段代码创建新的<p> 元素:

var para=document.createElement("p")

如需向 <p> 元素添加文本,您必须首先创建文本节点。这段代码创建了一个文本节点:

var node=document.createTextNode("这是一个新段落。")

然后您必须向 <p> 元素追加这个文本节点:

para.appendChild(node)

最后您必须向一个已有的元素追加这个新元素。

这段代码找到一个已有的元素:

var element=document.getElementById("div1")

以下代码在已存在的元素后添加新元素:

element.appendChild(para)

在获取到父节点的情况下 var parentNode =...

多次执行parentNode.appendChild(已经创建好的子节点)即可多次添加子节点


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11591509.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-17
下一篇 2023-05-17

发表评论

登录后才能评论

评论列表(0条)

保存