0

ヘルプ、

私は自分のページのオンライン寄付サイトの開発に取り組んでいます。ユーザーに支払いオプション（$ 5、$ 10、$ 20、その他）のあるドロップダウンボックスを用意してほしい。現在、「その他」オプションが選択されている場合に入力ボックスが表示されるように設定しています。別のオプション（$ 5、$ 10、$ 20）が選択されている場合、入力ボックスは非表示になります。さらに、寄付はペイパル経由で行われ、私はペイパル寄付ボタン/phpをサイトに組み込んでいます。私は次の問題に遭遇しました：入力ボックスは寄付されている金額を入力するフィールドであるため、Pay-Palはドロップダウン金額を認識しません。たとえば、[その他]オプションを選択した場合、入力ボックスに$ 100と入力し、ドロップダウンボックスから[$ 10]オプションを選択します（気が変わって、$100ではなく$10を寄付したいとします）。

修正があると思いますが、コーディング方法が必ずしもわかりません。次の点についてサポートを求めています。ユーザーがドロップダウンボックスからオプションを選択したときに、このアクションで（非表示の）入力ボックスにそれぞれの値を入力したいと思います。同様に、ユーザーがドロップダウンから「その他」オプションを選択した場合、ユーザーがこのオプションを自分で入力するので、入力ボックス（現在表示されている）に「」を入力します。

繰り返しになりますが、このようなコードを作成する方法がわかりません。誰かが私を正しい方向に向けてくれることを願っています。何卒よろしくお願い申し上げます。お時間をいただき、誠にありがとうございます。ありがとうございました！

編集：あなたの助けをありがとう。これが私が今持っているコードです：

    <select name="amount" id="otherFieldOption" class="dropdown">
                    <option value="20">$20</option>
            <option value="10">$10</option>
            <option value="5" selected="selected">$5</option>
            <option value="otherField">Other</option>   
    </select>

    <div id="otherField">
        Amount:
        <input type="text" id="amount" name="amount" class="textfield" size="10"/>
    </div>

jqueryコード：

$(document).ready(function() {
  $.viewInput = {
    '0' : $([]),
    //THIS IS THE NAME OF THE DIV WRAPPING THE HIDDEN FIELD
    'otherField' : $('#otherField'),
  };

$('#otherFieldOption').change(function() {
    // HIDES THE INPUT FIELD IF ANOTHER DROPDOWN ITEM IS SELECTED ONCE THE HIDDEN FIELD IS LOADED
    $.each($.viewInput, function() { this.hide(); });
    // SHOWS THE INPUT FIELD ITEM IF SELECTED
    $.viewInput[$(this).val()].show();
  });

});
4

3 に答える 3

5

これがデモです

<select id="choice">
    <option value="10">10</option>
    <option value="20">20</option>
    <option value="50">50</option>
        <option value="other">other</option>
</select>
<input type='text' id="other" class="hidden" />

と一緒に行くjquery

$('#choice').change(function(){
    var selected_item = $(this).val()

    if(selected_item == "other"){
        $('#other').val("").removeClass('hidden');
    }else{
        $('#other').val(selected_item).addClass('hidden');
    }
});
于 2011-04-12T01:30:29.563 に答える
0

ユーザーが選択ボックスをクリックしたら、テキストボックスをクリアします。

これを試して：

<select id="moneySelect" onchange="$('#moneyText').val(''); $('#sendValue').val(this.value);">
    <option value="10">10</option>
    <option value="20">20</option>
    <option value="50">50</option>
</select>
<input type='text' id="moneyText" onkeypress="$('#sendValue').val(this.value)">
<input type="hidden" name="sendValue" id="sendValue" />
于 2011-04-12T01:08:01.517 に答える
0 
<label>Donetion:</label>
    <input list="browsers" name="myBrowser" placeholder="Donetion" />
    <datalist id="browsers">
    <option value="$5">
    <option value="$15">
</datalist>
于 2020-10-22T07:12:23.657 に答える