jquery从文本框更新下拉菜单

时间:2013-05-28 09:07:29

标签: php ajax jquery

我是jquery的新手。我有一个文本框,我想从文本框中获取值并在下拉菜单中显示它。我在许多网站上搜索过该解决方案,但无法得到合适的答案。请帮助我在jquery中如何做到这一点。

文本框的代码如下所示。提前致谢,对不起我的英语。

<form method="post" action="inq.php">
<p><br>
<b>Question no:</b><br>
  <input class="inp-form" type="Text" name="qno" size="30" required>
  <br>
<br>
  <b>Question:</b><br>
  <textarea  name="question" rows="4" cols="50" required></textarea>
  <!--<input class="inp-form"type="Text" name="question" size="50">-->
  <br>
  <b>Option 1:</b><br>
  <input class="inp-form" type="Text" name="opt1" size="30" required>
  <br>
  <b>Option 2:</b><br>
  <input class="inp-form"type="Text" name="opt2" size="30" required>
  <br>
  <b>Option 3:</b><br>
  <input  class="inp-form"type="Text" name="opt3" size="30" required>
  <br>
  <b>Option 4:</b><br>
  <input class="inp-form" type="Text" name="opt4" size="30" required>
  <br>
  <b>Answer</b> (must be identical to correct option):<br>
  <input  class="inp-form" type="Text" name="answer" size="30" required>
  <br>
  <br>
  <input class="form-submit" type="Submit" name="submit" value="Add" required>
</p>
</form>

2 个答案:

答案 0 :(得分:1)

试试这个。将另一个类添加到选项文本框(即)option,如下所示。

添加onclick="AddQS()"以提交按钮。

添加一个下拉框。

function AddQS() {
     $('#sltOptions').empty();
     $('.option').each(function() {
         $('#sltOptions').append('<option value = ' + $(this).attr('name') + '>' + $(this).val() + '</option>');
      });
  }

<------------------>
<input class="inp-form option" type="Text" name="opt1" size="30" required>
<------------------>
<input class="form-submit" type="Submit" name="submit" value="Add" onclick="AddQS()" required>
<------------------>
<select id="sltOptions">
</select>

答案 1 :(得分:1)

请查看http://jsfiddle.net/2dJAN/47/

$('.options').change(function(){
        var val = $(this).val().trim();
        $("#answer").append("<option value='"+val+"'>"+val+"</option>");        
});

让我知道这个例子是否满足你的要求。