3

私の div タグには、非常に長いテキストの行が多数あり、div 要素は現在スクロール可能です。私がやりたいのは、特定の文字列の最初の出現を見つけて、その文字列を含む行まで自動的にスクロールすることです。改行や、スクロール位置を簡単に概算するために使用できる文字列区切り記号はありません。

私はこのようなことができると思います:

var max_chars_per_line = approximated max # of chars that can fit into one line;
var font_height = approximated font height in px;
var needle = string to look for;
var haystack = content in the <div> tag;
var index = haystack.indexOf(needle);
var num_lines_to_skip = index / max_chars_per_line;
my_div_tag.scrollTo(num_lines_to_skip * font_height);

もっと良い (javascript/jQuery) ソリューションがあるのではないかと思わずにはいられません。私自身のデューデリジェンスでは何も見つかりませんでした。

4

3 に答える 3

1

すべてのテキストが単一のdivにある場合は、このソリューションのようなものが機能します。

var goto = function(str){

    var content = $('#content').html();
    $('#content').html( content.replace(str,'<a name="goto">'+str+'</a>') );
    window.location = '#goto';
}

goto('Whatever your string is here');

http://jsfiddle.net/NmhHH/

于 2012-11-25T05:20:09.067 に答える
1
<p id="text">Lorem ipsum ... lots of text.... onion</p>

jQ:

var needle = 'onion';
$('#text').html($('#text').html().replace(needle, '<a id="imhere"></a>'+needle));
$('html,body').animate({scrollTop: $('#imhere').offset().top​}, 500);​​​​​​​​​​​​

デモhttp://jsfiddle.net/vq7LD/

于 2012-11-25T05:20:22.170 に答える
-1

次のJavaタイプコードを使用するのと同様のことを行うことができませんでした。

  var lineToTest = getLine(textArray);

  if(lineToTest.contains(testingLine){
   lineIndex = getLineNumber(textArray-1); //since it already accessed the line it'll have to access the next and subtract 1. }

次に、強調表示手法を使用して線を強調表示します。明らかに、getLine、getLineNumber関数を作成する必要があります。そこにいくつかのクールなjQuery関数がない限り(おそらくそうです)。

于 2012-11-25T05:18:49.940 に答える