在下拉菜單選擇上創建文本字段

Question

我有一個簡單的引號形式，與我有一些問題，我希望當從下拉菜單中選擇特定字段時出現一個文本字段，我的代碼如下：

<script type="text/javascript">
$(document).ready(function(){
          $("#hear").change(function(){       
             $("#quote").find(".field").remove(); 
             //or
               $('#quote').remove('.field');
          if( $(this).val()=="value5")
             {
        $("#quote").append("<input class='field' type='text' />");

             }
          });

});
</script>

<form id="quote" class="quote-form">
<input name="" class="text-field" type="text" placeholder="Full Name" />
<input name="" class="text-field" type="text" placeholder="Contact Number" />
<input name="" class="text-field" type="text" placeholder="E-Mail Address" />
<select id="hear" name="hear" class="select-field">
<option value="value1" selected="true" disabled="disabled">Where did you hear about us? (Please Select)</option>
  <option value="value2">Check-a-Trade</option>
  <option value="value3">MyBuilder</option>
  <option value="value4">Referred by a Friend (Please State)</option>
  <option value="value5">Other (Please State)</option>
</select>
<input name="" class="text-field" type="text" placeholder="Location" />
<textarea name="" cols="" rows="8" class="text-area" placeholder="Description of your Desired Works.."></textarea>
<input name="" type="submit" class="quote-form-button"/>


</form>

上面的代碼在選擇“其他”時應創建一個文本字段，盡管我遇到了一些問題，但希望能有所幫助，加油！

Answer 1

您沒有提到詳細的錯誤。但是，除了刪除字段之外，我還可以選擇隱藏東西，盡管它可能會根據您的確切要求而有所不同。

在此示例中，當您選擇“其他”時，將使用提供的索引創建文本框。在其他一些選擇中，文本字段將被隱藏。

$(document).ready(function() {    
$('#hear').change(function() {
var val = $(this).find("option:selected").text();
if (val == "Other") {
$("#quote").append('<input type="text" name="textbox' + index + '" id="textbox' + index + '" value="">');
} 
if(val == "some value"){
$('#your text field id').hide();
}).change();
});