0

ほぼ完了しましたが、バスは私にとって小さなことで大きな問題を抱えていました。

作業例http://jsfiddle.net/auvi1/QSe4M/3/

例でわかるように、リンクをクリックすると値がテキストエリアに渡されますが、行カウント スクリプトを実行できません。テキストエリア内をクリックすると行がカウントされますが、それは私がやりたいことではありません。値がテキストエリアに入力されるたびにカウントボックスを自動的にインクリメントすることですこれは意味がありますか?

<script type='text/javascript'>
    window.onload = btnsInit;

    function btnsInit() {
        var i, a = document.getElementById('btns').getElementsByTagName('a');
        for (i = 0; i < a.length; ++i) {
            a[i].onclick = btnClick;
        }
    }

    function btnClick(e) {
        document.getElementById('myTextarea').value += '' + this.firstChild.nodeValue + '\n';
        xPreventDefault(e);
        trim();
        console.log("#myTextarea =", document.getElementById('myTextarea').value);
        return false;
    }

    function xPreventDefault(e) {
        if (e && e.preventDefault) e.preventDefault();
        else if (window.event) window.event.returnValue = false;
    }

    function cuentaRenglones(area) {
        var renglones = area.value.replace((new RegExp(".{" + area.cols + "}", "g")), "\n").split("\n");
        if (renglones[renglones.length - 1] == "") renglones.length--;
        area.form.contador.value = renglones.length;
    }
</script>
<div id='btns'>
    <form>
        <textarea rows="10" id='myTextarea' style="" name=" " onclick="cuentaRenglones(this)"></textarea>
        <br>Lines:
        <input type=text name="contador" size="2" value="0">
    </form>
    <a onclick='return false' href=' '>Link1</a>
    <a onclick='return false' href=' '>Link2</a>
    <a onclick='return false' href=' '>Link3</a>
    <a onclick='return false' href=' '>Link4</a>
</div>
4

1 に答える 1

1

これを見てください:

http://jsfiddle.net/Eb4U7/

keyup イベントに変更しましたが、リンクをクリックした後に行をカウントするコマンドも追加しました。そうしないと、テキスト領域で何かを編集した場合にのみカウントが更新されます。

<script type='text/javascript'>
window.onload=btnsInit;
function btnsInit() {
    var i,a=document.getElementById('btns').getElementsByTagName('a');
    for(i=0;i < a.length;++i) {
        a[i].onclick=btnClick;
    }
}

function btnClick(e) {
    document.getElementById('myTextarea').value += '' + this.firstChild.nodeValue + '\n';
    xPreventDefault(e);
    cuentaRenglones(document.getElementById('myTextarea'));
    trim();
    console.log("#myTextarea =", document.getElementById('myTextarea').value);

    return false;
}

function xPreventDefault(e) {
    if(e && e.preventDefault)e.preventDefault();
    else if(window.event)window.event.returnValue=false;
}

function cuentaRenglones(area){
    var renglones = area.value.replace((new RegExp(".{"+area.cols+"}","g")),"\n").split("\n");
    if(renglones[renglones.length-1]=="") renglones.length--;
        area.form.contador.value = renglones.length;
}
</script>
<div id='btns'>
<form>
<textarea rows="10" id='myTextarea' style="" name=" "  onkeyup="cuentaRenglones(this)"></textarea>
<br>
Lines:
<input type=text name="contador" size="2" value="0">
</form>
<a  onclick='return false'href=' '>Link1</a>
<a  onclick='return false' href=' '>Link2</a>
<a  onclick='return false' href=' '>Link3</a>
<a  onclick='return false' href=' '>Link4</a>
</div>​
于 2012-08-01T22:17:30.877 に答える