0

ユーザーが同じページの別の部分の入力フィールドを変更したときに、Javascript を使用して Web ページの一部を更新する方法を見つけようとしています。ただし、document.write を使用しているため、ページをリロードしない限り、後で戻ってこれを更新することはできません。私は JavaScript の能力があまり高くないことを認めます。この問題に取り組む方法について誰かが私にアドバイスをくれるなら、それは大歓迎です。Ajax を使用せずにこれを行う方法があることを願っています。これは非常に単純な作業であり、複雑になりすぎたくないからです。

私のサイトには、ページをロード/リロードせずにステップを実行するために div を表示および非表示にする 5 つのステップの見積もり計算機があります。最後のステップ 5 では、ステップ 1 に基づいて計算を実行し、document.write を使用して出力します。しかし、ユーザーがステップ 1 に戻って入力テキスト フィールドを変更できるようにしているため、ユーザーが戻ったときにステップ 5 の計算が正しくなくなります。

jQuery を使用していくつかのクールなトランジション効果を実行しているので、ページのリロードを避けたいと思います。このような問題にアプローチする最善の方法は何ですか?

喜んで自分で調査を行いますが、どこから始めればよいか正確にはわかりません。ありがとう

4

1 に答える 1

1

ステップ 5 のフィールドが自動的に更新されるように、ステップ 1 のフィールドの onchange イベントで計算をバインドする必要があります。

例: 画面 1 の場合:

<input type="text" name="inputFromScreen1" id="input1" onchange="calculateResult()">

画面 5 では:

<div id="results"></div>

JS:

function calculateResult()
{
   //parse the values into float or int otherwise you'll get a concatenated string
   var result=parseInt($("#input1").val())+.....;

   //check if your result is a number
   if (!isNaN(result))
       $("#results").html('<p>'+result+'</p>');
}

*注: 私は JQuery を使用しています。なぜなら、DOM 操作が非常に簡単になり、クロスブラウザー互換性があるからです。詳細については、http://jquery.com/をご覧ください。

于 2012-07-30T07:17:57.497 に答える