2011-07-01 14 views
1

javascriptを使用してonClickを介してテキストエリアに文字を挿入する方法はありますか?文字は、単に基本的な、派手である必要はありません。私はどこから始めるべきか知りませんので、表示するコードはありません。たぶんクリック可能なdivですか?JavaScriptを使って文字を挿入する

EDIT:既に入力された単語でテキストエリアに文字を挿入するにはどうすればよいですか?私はすでにそこにあるものを消去したくないです

+1

で*をマーク。 – Betamos

答えて

0

あなたが望むものであれば、テキストエリアの内容を簡単に置き換えることができます。あなたの関数では:

var text = this.value; 
text.replace('mom','mother'); // Replace 'mom' with 'mother' 
text += "And add some text at the end"; 
text = "And maybe add text at the beginning" + text; 
this.value = text; // And finally replace it 
+0

http://jsfiddle.net? –

+0

私をjsfiddle.netにリンクさせる目的はありましたか? – Flimzy

+0

はい。あなたが実証するためにフィドルを提供すれば、私はアップヴォートするでしょう。 :) –

1

提供あなたはそれらのテキストノードが文字となっているbuttonの要素を持っています。

var buttons = document.getElementById('chars').getElementsByTagName('button'), 
    textarea = document.getElementById('char-list'); 

for (var i = 0, length = buttons.length; i < length; i++) { 
    buttons[i].onclick = function() { 
     textarea.value += buttons[i].textContent || buttons[i].innerText; 
    } 
} 

テキストノードの場合は、buttons[i].firstChild.dataにアクセスすることもできます。

+0

私はこれに従うが、OPがしているのだろうか? –

+0

@ジャレ私はそう願っています。私は*これはOPが望んだものだと思うが、100%確実ではないと思う。 – alex

+0

ああ、私は彼らが何を望んでいるか分かりません。私の占い棒はフリッツと店内にあります。私はそれが彼らの頭の上にWAAAAYだと思います。 :) –

1

シンプル:

HTML:

<textarea id="input"></textarea> 
<button onclick="makeTextAppear();">Presto!</button> 

はJavaScript:

function makeTextAppear() { 
    var text = document.getElementById('input'); 
    text.value = "Hello World"; 
} 
0

シンプル:ここ

<textarea name="field" id="field"></textarea> 

<div id="content"> 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas porttitor congue massa. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna. Nunc viverra imperdiet enim. Fusce est. Vivamus a tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pharetra nonummy pede. Mauris et orci. Aenean nec lorem. 
</div> 

<input type="button" value="Button" onclick="document.getElementById('field').innerHTML = document.getElementById('content').innerHTML" /> 
0

あなたが始めるためのようなもの:

まず、ここで

<div id="yourID" onclick="funct1();"

としてDIVにfunct1をonclickのハンドラを追加

HTML : 
<input type="button" value="A" /> 
<input type="button" value="B" /> 
<input type="button" value="C" /> 
<input type="button" value="D" /> 
<textarea id="toBeFill"></textarea> 

Javascript using JQuery: 
$("input[type=button]").live('click',function(){ $('#toBeFill').text($('this').val()); }) 
0

は、クリック時に呼び出される関数です。 funct1の中で、やりたいことを何でもしてください。

は、あなたがそれを編集することができます

function editTextNode(textNode,text,pos){ 
    var val=textNode.nodeValue; 
    if(pos=="END"){ pos=val.length; } //add at end of existing text 
    val=val.slice(0,pos) + text + val.slice(pos); //* 
    textNode.nodeValue=val; 
} 

この方法では、とにかくあなたが好きな機能を使用し、テキスト値を編集します。あなたがしなければならないのは、textnodeを取得してこの関数を呼び出すことだけです。あなただけの最後に追加したい場合は、あなたはposをcontiningすべての文を削除して、文を置き換えることができ、おそらく例のシナリオで、より詳細に説明してくださいval+=text

関連する問題