Jsスクリプトはonchangeを実行し続けます

次のコードは、テキストボックスを追加し続けます。私は最初の選択肢が終わったときにそれを追加するだけです。あなたが1つを押すと、2つを押すと、さらに2つが追加されます。Jsスクリプトはonchangeを実行し続けます

$(function(){ 
 
    $('select').on('change', function() { 
 
    i = 1 
 
    var y = parseInt(this.value) + 1 
 
    \t while (i != y) 
 

 
    \t { 
 
    \t \t $("#boxes").append('<input type="text" name="ticket_'+ i + '_name" placeholder="Ticket ' + i +' Type">'); 
 
    \t \t $("#boxes").append('<input type="text" name="ticket_'+ i + '_price" placeholder="Ticket ' + i +' Price">'); 
 
    \t \t $("#boxes").append('<input type="text" name="ticket_'+ i + '_quantity" placeholder="Ticket ' + i +' Quantity">'); 
 
    \t \t $("#boxes").append('<p></p>'); 
 
    \t \t i = i + 1 
 

 
    \t \t if (i == y){ 
 
    \t \t \t return false 
 
    \t \t } 
 
    \t } 
 
    
 
    }) 
 
});

<html> 
 
    <head> 
 
    <meta charset="utf-8" /> 
 
    <script data-require="jquery" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="add.js"></script> 
 
    </head> 
 

 
    <body> 
 

 
    <select id="droplist"> 
 
    \t <option>Select</option> 
 
\t \t <option value="1">One</option> 
 
\t \t <option value="2">Two</option> 
 
\t \t <option value="3">Three</option> 
 
    </select> 
 

 

 
    <form id="boxes"> 
 
\t \t <input type='hidden' name='eventname' value='$eventname '> 
 
    </form> 
 

 
    </body> 
 

 
</html>

出典

2017-10-11 d joe

.append()機能を使用すると、（これはAPPENDの定義である）あなたが選択した要素の最後にそれに持っているものは何でも追加されます。だから、あなたのコードは「選択されたオプションが選択されたときはいつでも、これらを最後にタックします」と言います。

しかし、最後に新しいものを追加したくないように思えます。あなたはそれらを唯一のものにしたい、つまり最初のものをあらかじめ取り除くことを意味します。

while(i != y)行の上に、$('#boxes').empty();を追加します。 Thisは、フィールドの新しいラウンドを置くためにあなたの空のフィールドを与え、すべての要素現在の内部#boxesを削除します。

をまた、サイドノートを、代わりにそのwhileとifとreturn false事業の、あなたがより良い使用して提供される可能性がありますforループ。

出典

2017-10-11 02:07:12 ben

こんにちは:)ほぼ動作します！ 2つのチケットタイプで2が選択された場合は2つのボックス、さらに3が選択された場合は3つのボックスが必要です。これはすべてを排除し、ただ一つ与えるだけです。 –

ああ、これはループの中にあるので。私の悪い、中になるのではなく、whileループの前に空の行を移動してください。答えを更新して反映させていきます。 – ben

Jsスクリプトはonchangeを実行し続けます

答えて

関連する問題