1

以前の ajax 呼び出しがデータを提供し、html を入力する次のスクリプトがあります。以前のデータを置き換える代わりに、新しい行に入力するすべての新しい呼び出しを行うことができないことを除いて、それは正常に機能します。追加しようとしましたが、1文字追加してすべての単語を繰り返し入力します。

var isInTag = false;

function typetext() {
var thisChar = data.substr(c, 1);
if( thisChar == '<' ){ isInTag = true; }
if( thisChar == '>' ){ isInTag = false; }
$('#field').html(" "+data.substr(0, c++));
if(c < data.length+1)
    if( isInTag ){
        typetext();
    }else{
        setTimeout("typetext()", 100);
    }
else {
    c = 1;
    data = "";
}
}

そして ajax 呼び出しで:

data = '<span class="input">' + data + '</span><br />\n';
c = 0;
typetext();

助けていただければ幸いです。

4

2 に答える 2

1

OK、あなたのコードにはいくつかの問題がありました。私は、あなたが望むものにかなり近いバージョンを動作させることができました (私は思う)。

ここを見てください。変更した理由を明確に理解できるように、変更した部分にコメントを付けました。

http://jsfiddle.net/MjS4t/2/

基本的に、2 つの問題がありました。まず、次の行です。

$('#field').html(" "+data.substr(0, c++));

thisCharvarから追加したい文字を既に取得しているため、変数を使用する必要がありましたdataが、確かではありませんが、substr()呼び出しが原因で間違った文字 (または同じ文字が何度も何度も) をエコーアウトしたと思います。

私はそれを : に変更 し、次の行$('#field').append(thisChar);に移動しc++ました。これにより、読みやすくなりました。

次に、タイムアウトの呼び出しが間違っていました。関数名を引用符で囲むことは、次のように関数を変数に代入する場合にのみ機能します。

var functionName = function(){ alert('hello world'); };

しかし、別の構文を使用して、次のように宣言しました。

function functionName(){ ... }

そこで、setTimeout 呼び出しを次のように変更しました。

setTimeout("typetext()", 100);

これに：

setTimeout(function() {typetext()},100);

このようにして、テキストが少し遅れて表示され、入力されました。

javascript set timeout を使用した遅延の詳細については、こちらを参照してください: http://www.sean.co.uk/a/webdesign/javascriptdelay.shtm

そして、jQuery の$.delay()は一読の価値があります。

于 2012-09-21T10:57:58.963 に答える
1

確かに次の行：

$('#field').html(" "+data.substr(0, c++));

次のようにする必要があります。

$('#field').append(" "+data.substr(c, c++));

一度に1文字ずつ書き出すのではなく、文字列を0からc++

または、確実に同じ効果を得るのthisCharではなく、変数を使用することを検討できますか?data

于 2012-09-21T10:37:26.157 に答える