2011-09-17 22 views
1

私はthisの質問に似ていますが、Androidで文字列onClickのインデックスを取得することについて、私は今JavaScriptで同じことをしたいと思います(もしあればjQueryライブラリを使用しています便利な機能もあります)。私はオンラインで検索したので、何も見つけられないようです。私の答えは、(x、y)座標とオフセット、which I noticed jQuery hasを扱っていますが、実際の(x、y)座標ではなく、ドキュメント全体の要素の位置を示すようです。 JavaScriptで(x、y)座標を取得する同様の方法がありますか(またはインデックスを取得するさらに簡単な方法)ですか?OnClick Index in String

Mary never went to school. Mary was way too cool. 

私がそうで、私は戻って3を得ることができるように、誰かが最初に「メアリー」には「y」をクリックした場合、それを持ちたいと:私の質問は十分に明確でない場合は、次の文字列を与えられました。

いつものように、どんな助けや方向性も高く評価されています。

+2

それはdiv要素内のテキストでなければなりませんか?この何かのために、キャンバス要素に独自の文字列を描画し、それを使ってクリック対テキスト位置を計算する方が簡単かもしれません。 https://developer.mozilla.org/en/Drawing_text_using_a_canvas – arunkumar

+0

マット私はそれがどんなコードなしでもSOに質問をするのがいかに迷惑であるか理解しています。私は、適切な方向性を持っていて、技術的/実装上の面でうんざりしていたら、いくつかのコードを表示します。今私は単に方向性が必要です。私は実際のコードを求めていません。 – Vinay

+0

'(x、y)'やインデックスを文字列に入れたいですか? – pimvdb

答えて

2

テキストが十分に短い場合は、各文字をそれ自身の<span>で囲むのは恐ろしいことではありません。以下のような

何か:

var text = $("#clickable-letter-div").html(); 

var wrapped = $.map(text.match(/./g), function(s, idx){ 
    return "<span class='letter'>" + s + "</span>" 
}).join(""); 

$("#clickable-letter-div").html(wrapped); 

$(".letter").click(function(){ 
    var pos = $(this).parent().children().index(this); 
    alert(pos); 
}); 
+0

ああ、そんなことは考えてなかった。ストリングスはあまり長くはないでしょう。おそらく50〜70文字(String/snippetあたり)です。ありがとう、ABentSpoon、私は間違いなくこれを試してみます。 – Vinay

+0

これを実装しました。魅力のように動作します。本当にありがとう。私はちょうど一般的な方向でうまくいっていたでしょうが、これは非常に簡潔で、簡単に従うコードでした。私は2倍upvoteすることができたらいいと思う。 – Vinay

+1

's'はマークアップ文字列に挿入する前にHTMLでエスケープしなければなりません。そうしないと、テキスト中の' <'や'& '文字が壊れます。 – bobince