可编辑div 限制文字输入,并且光标定位在文字最后

光标在最后的代码实现:

http://qa.helplib.com/606846

http://jsfiddle.net/timdown/vXnCM/

 

<div id="editable" contenteditable="true">

  text text text<br>text text text<br>text text text<br>

</div>

<div class="tip" id="tip"></div>

<button id="button" οnclick="setCaret()">focus</button>

 

 

function setCaret() {

    var el = document.getElementById("editable");

    var range = document.createRange();

    var sel = window.getSelection();

    range.setStart(el.childNodes[2], 5); 

    range.collapse(true);

    sel.removeAllRanges();

    sel.addRange(range);

    el.focus();

}

----------

长度限制代码:

$("#editable").keyup(words_deal);

    

    function words_deal() { 

     var editable = $('#editable');

     var editableHtml = $.trim(editable.html());

var curLength=editableHtml.getBytesLength(); 

if(curLength > maxLength) { 

 editable.html(editableHtml.substr(0,maxLength));

 var el = document.getElementById("editable");

   var range = document.createRange();

   var sel = window.getSelection();

   range.setStart(el.childNodes[0], maxLength);

   range.collapse(true);

   sel.removeAllRanges();

   sel.addRange(range);

   el.focus();

else { 

   $("#tip").text(maxLength-curLength); 

}

//utf-8 一个汉字占3个字节,所以是---

String.prototype.getBytesLength = function() {

    return this.replace(/[^\x00-\xff]/gi, "---").length;

    }

 

其他例子:转自:http://www.softwhy.com/forum.php?mod=viewthread&tid=8303

 

 

 

 

 

 

 

The Range.setStart() method sets the start position of a Range.

If the startNode is a Node of type TextComment, or CDATASection, then startOffset is the number of characters from the start of startNode. For other Node types, startOffset is the number of child nodes between the start of the startNode.

Setting the start point below (lower in the document) the end point will result in a collapsed range with the start and end points both set to the specified start position.

SyntaxEDIT

range.setStart(startNode, startOffset);

Parameters

startNode
The  Node where the  Range should start.
startOffset  
An integer greater than or equal to zero representing the offset for the start of the  Range from the start of  startNode.

ExampleEDIT

var range = document.createRange();
var startNode = document.getElementsByTagName("p").item(2);
var startOffset = 0;
range.setStart(startNode,startOffset);
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值