커서위치에 글자(문자) 삽입하기

Insert script at cursor position

매게변수는 접근아이디, 텍스트


function insertAtCursor(areaId,text)

{

    var txtarea = document.getElementById(areaId);

    var scrollPos = txtarea.scrollTop;

    var strPos = 0;

    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ?

        "ff" : (document.selection ? "ie" : false ) );

    if (br == "ie") {

        txtarea.focus();

        var range = document.selection.createRange();

        range.moveStart ('character', -txtarea.value.length);

        strPos = range.text.length;

    }

    else if (br == "ff") strPos = txtarea.selectionStart;

 

    var front = (txtarea.value).substring(0,strPos);

    var back = (txtarea.value).substring(strPos,txtarea.value.length);

    txtarea.value=front+text+back;

    strPos = strPos + text.length;

    if (br == "ie") {

        txtarea.focus();

        var range = document.selection.createRange();

        range.moveStart ('character', -txtarea.value.length);

        range.moveStart ('character', strPos);

        range.moveEnd ('character', 0);

        range.select();

    }

    else if (br == "ff") {

        txtarea.selectionStart = strPos;

        txtarea.selectionEnd = strPos;

        txtarea.focus();

    }

    txtarea.scrollTop = scrollPos;

}



신고


 


<script type="text/javascript">

jQuery(function(){

    // 숫자 제외하고 모든 문자 삭제.

    $.fn.removeText = function(_v){

        //console.log("removeText: 숫자 제거 합니다.");

        if (typeof(_v)==="undefined")

        {

            $(this).each(function(){

                this.value = this.value.replace(/[^0-9]/g,'');

            });

        }

        else

        {

            return _v.replace(/[^0-9]/g,'');

        }

    };

     

    // php의 number_format과 같은 효과.

    $.fn.numberFormat = function(_v){

        this.proc = function(_v){

            var tmp = '',

                number = '',

                cutlen = 3,

                comma = ','

                i = 0,

                len = _v.length,

                mod = (len % cutlen),

                k = cutlen - mod;

                 

            for (i; i < len; i++)

            {

                number = number + _v.charAt(i);

                if (i < len - 1)

                {

                    k++;

                    if ((k % cutlen) == 0)

                    {

                        number = number + comma;

                        k = 0;

                    }

                }

            }

            return number;

        };

         

        var proc = this.proc;

        if (typeof(_v)==="undefined")

        {

            $(this).each(function(){

                this.value = proc($(this).removeText(this.value));

            });

        }

        else

        {

            return proc(_v);

        }

    };

    $.fn.onlyNumber = function (p) {

        $(this).each(function(i) {

            $(this).attr({'style':'text-align:left'});



             

            this.value = $(this).removeText(this.value);

            this.value = $(this).numberFormat(this.value);

             

            $(this).bind('keypress keyup',function(e){

                this.value = $(this).removeText(this.value);

                this.value = $(this).numberFormat(this.value);

            });

        });

    };

    $('.numberformat').onlyNumber();

});

</script>




1. 위 소스 추가

2. 콤마찍고싶은 input 클래스에 numberformat 추가

3. 콤마데이터 전송시 db 구성에 문제가 있을 수 있으니 submit 할때에 $('.numberformat').removeText(); 를 호출해주면 콤마를 삭제하고 데이터를 전송

4. 감사 댓글 달기

신고




<style type="text/css">

* { margin:0; padding:0; }

ul,li { list-style:none; }

a { text-decoration:none; color:#000; }

.tab { border:1px solid #ddd; border-left:none; background:#fff; overflow:hidden; }

.tab li { float:left; width:33.3%; border-left:1px solid #ddd; text-align:center; box-sizing:border-box; }

.tab li { display:inline-block; padding:20px; cursor:pointer; }

.tab li.on { background-color:#eee; color:#f00; }

.tab_con { clear:both; margin-top:5px; border:1px solid #ddd; }

.tab_con div { display:none; height:100px; background:#fff; line-height:100px; text-align:center; }

</style>


<script type="text/javascript">

$(function () {

tab('#tab',0);

});


function tab(e, num){

    var num = num || 0;

    var menu = $(e).children();

    var con = $(e+'_con').children();

    var select = $(menu).eq(num);

    var i = num;


    select.addClass('on');

    con.eq(num).show();


    menu.click(function(){

        if(select!==null){

            select.removeClass("on");

            con.eq(i).hide();

        }


        select = $(this);

        i = $(this).index();


        select.addClass('on');

        con.eq(i).show();

    });

}

</script>

<ul class="tab" id="tab">

    <li>A</li>

    <li>B</li>

    <li>C</li>

</ul>


<div class="tab_con" id="tab_con">

    <div>1st Contents</div>

    <div>2nd Contents</div>

    <div>3rd Contents</div>

</div>


※ jquery import 필요

신고

+ Recent posts

티스토리 툴바