0

私は最近、Jquery Steps を使用してクライアント向けの葬儀費用計算ツールを作成しました。

ツールのフォームは非常に複雑で、特定のフォーム オプションが選択されているかどうかによっていくつかのステップが異なります。

ラジオボタンの「オンチェンジ」をトリガーする「挿入」および「削除」メソッドを使用して、自分でこれに対応することができました。ユーザーが死亡したことを選択すると、7 つのステップがあります。ユーザーが死亡していないことを選択すると、 5 つのステップがあります (添付の画像を参照)。(サンプルコードについては、以下を参照してください)

死亡は発生していません (スクリーンショット)

死が発生しました（スクリーンショット）

ステップはインデックス 4 で挿入および削除されます。ユーザーがオプション間を行ったり来たりすると、2 が挿入されてから 2 が削除され、2 が挿入されてから 2 が削除されます。

同様の条件を適用する必要があるフォームにさらに進むと、問題が発生しました。ただし、この時点でステップ数を予測できなかったため、挿入または削除するインデックスを具体的にターゲットにできないことがわかりました (ユーザーの以前の選択に基づいているため、上記を参照)。

私のjavascriptの知識は限られているので、途方に暮れています。それを機能させるために必要なロジックは知っていますが、それを実装する方法がわかりません。

javascript/jquery を使用して (最後のステップをターゲットにするために) ステップ数をカウントし、現在のステップをターゲットにする方法を知りたいです。もちろん、誰かが提案できるより簡単な方法またはより良い方法がない限り.

私はこれについて頭を悩ませてきましたが、どんな助けもいただければ幸いです。ありがとうございました！

<input type="radio" name="deathOccurred" rel="death-occured-yes" value="Yes"  class="required" onclick="calculateTotal()" onchange="$('#estimator-form').steps('insert', 4, {
    title: 'Clergy/Celebrant',
    content: '<STEP HTML HERE>'
});
$('#estimator-form').steps('insert', 5, {
title: 'Other options',
content: '<STEP HTML HERE>'
/> Yes &nbsp;&nbsp;
<input type="radio" name="deathOccurred" rel="death-occured-no" value="No" checked  onclick="calculateTotal()" onchange="$('#estimator-form').steps('remove', 5, {});  $('#estimator-form').steps('remove', 4, {});" /> No
4

2 に答える 2

1

これが使用しているプラ​​グインである場合、メソッドのサイズや長さが期待どおりではないようです。たぶん、jquery を使用して自分で把握し、たとえば h1 要素の数を数えることができます。

var wizardLength = $("#estimator-form").find('h1').length;

したがって、挿入の代わりに「追加」メソッドを使用すると、最後に追加されると思います。最後のものを削除したい場合は、index = wizardLength - 1 で 'remove' を使用できます。

于 2014-03-25T09:38:02.397 に答える