微软雅黑字体改为两个空格占一个汉字的宽度

获取光标位置

//ctrl 是dom节点
function getCursortPosition (ctrl) 
{
    //获取光标位置函数 
    var CaretPos = 0; 
    // IE Support
    if (document.selection) 
    { 
        ctrl.focus (); // 获取焦点
        var Sel = document.selection.createRange (); // 创建选定区域
        Sel.moveStart(character, -ctrl.value.length); // 移动开始点到最左边位置
        CaretPos = Sel.text.length;                      // 获取当前选定区的文本内容长度
    } 
    // Firefox support (非ie)
    else if (ctrl.selectionStart || ctrl.selectionStart == 0)
    {
        CaretPos =ctrl.selectionStart; // 获取选定区的开始点 
    }
    return CaretPos; 
}

设置光标位置

//ctrl 是dom节点，pos 是要定位到的位置
function setCaretPosition(ctrl, pos)
{
    //设置光标位置函数 
    if(ctrl.setSelectionRange)   //非ie
    {
        ctrl.focus();  // 获取焦点
        ctrl.setSelectionRange(pos,pos);  // 设置选定区的开始和结束点
    } 
    else if (ctrl.createTextRange)
    { 
        var range = ctrl.createTextRange();  // 创建选定区
        range.collapse(true);                // 设置为折叠,即光标起点和结束点重叠在一起
        range.moveEnd(character, pos);     // 移动结束点
        range.moveStart(character, pos);   // 移动开始点
        range.select();                      // 选定当前区域
    } 
}

有一个场景，使用Microsoft Yahei字体，三个空格大约占据一个汉字的宽度。现在将其更改为占据一个汉字宽度的两个空格。将其替换为。由于textarea不会解析转义字符，因此请创建一个隐藏的div，让div首先进行解析，然后检索内容并将其放入textarea中。由于将在段落的中间插入一个空格，因此将使用光标的获取和设置。

代码如下：

<textarea id="textarta" cols="30" rows="10">textarea>
<div id="div" style="display: none">div>

//在非ie浏览器下
//用jq写的代码
$(#textarea).keyup(function (e) {
    //敲入空格时
    if (e.keyCode == 32) {
        var index = $(this)[0].selectionStart; //获取光标位置
        var text = $(this).val();
        text = text.replace(/ /,  );
        var html = $(#div).html(text).text();
        $(this).val(html);
        //设置光标位置
        //$(this)[0].focus();
        $(this)[0].setSelectionRange(index, index);
    }
});

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/bofangqi/article-372422-1.html