動的なjsはユーザーからの入力に応じて答えます

Question

私はフォームを作成したいと思っています。ユーザーが入力ボックスで答えると、そのボックスの下にイミデートの回答があるはずです。 Like Question： あなたはどの車を運転しますか？私：フォード

動的応答：あなたはフォードを運転する！ どのようなフォード？

「ユーザーのために答えるために別の入力ボックス」

これはまったくのjQuery、JavaScriptで行われるべきではありません。私はいくつかのガイドラインが必要です。

Answer 1

入力テストボックスで使用できるさまざまなイベントを使用してこれを行うことができます。 たとえば、テキストボックスにはonchangeイベントまたはonblurイベントを使用し、それらのイベントに適切なロジックを書き込むことができます。それは動的に実行されます。 これを参照してくださいreference

Answer 2

イベントを簡単に処理できるJQueryを使用してください。あなたが望むかもしれない具体的なものは、変更することです：http://api.jquery.com/change/

しかし、あなたがどこから始めたらよいかを尋ねなければならないという事実から判断して、この問題に関するチュートリアルを読むことをお勧めします。例えば参照：http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery

Answer 3

HTML

<div id='questions'></div>​ 

とJavaScript

var _$ = function(id) { 
    return document.getElementById(id); 
}; 

var handle = function(e, div, num, q) { 
    num = num || 0; 

    var n_div = document.createElement('div'); 
    n_div.innerHTML = q[num].replace(/\$\{ans\}/g, e.value); 
    console.log(e.value) 
    div.appendChild(n_div); 

    if (num + 1 < q.length) { 
     var i = document.createElement('input'); 
     i.type = 'text'; 
     i.onblur = function() { 
      handle(i, div, num + 1, q); 
     }; 

     div.appendChild(i); 
    } 
}; 

var question = [ 
    'What car do you drive?', 
    'So you drive a ${ans}, what kind?', 
    'I like the ${ans} kind, where do you drive it?', 
    'Its nice to drive at ${ans}' 
], div; 

div = _$('questions'); 

var n_div = document.createElement('div'); 
n_div.innerHTML = question[0]; 
div.appendChild(n_div); 

var i = document.createElement('input'); 
i.type = 'text'; 
i.onblur = function() { 
    handle(i, div, 1, question); 
};        
div.appendChild(i); 

ここにあなたが行く、example