Question

我有一个Web应用程序，用户可以在其中动态添加家喻户晓名称，并在需要时删除这些名称。

在我看来：

<tr>
    <td>Add Household</td>
</tr>
    <tr>
        <td>
            <div class="field_wrapper">
                <div>
                    <select name="field_name[]" value="" id="drop2"  style="color:black;">
                        <?php
                              foreach ($head as $row) {
                                echo "<option style='color:black;' value='".$row['hh_id']."'>".$row['hh_fname']."  ".$row['hh_lname']."</option>";?>
       </select>
                              <a href="javascript:void(0);" class="add_button" title="Add field"><img src="<?php echo base_url('dist/img/add-icon.png'); ?>" /></a>
                     </div>
              </div>
          </td>
   </tr>

脚本：

<script type="text/javascript">
$(document).ready(function(){
var maxField = 10; //Input fields increment limitation
var addButton = $('.add_button'); //Add button selector
var wrapper = $('.field_wrapper'); //Input field wrapper


var fieldHTML = '<div><select name="field_name[]"><option></option></select><a href="javascript:void(0);" class="remove_button" title="Remove field"><img src="<?php echo base_url("dist/img/remove-icon.png"); ?>" /></a></div>'; //New input field html 
var x = 1; //Initial field counter is 1
$(addButton).click(function(){ //Once add button is clicked
    if(x < maxField){ //Check maximum number of input fields
        x++; //Increment field counter
        $(wrapper).append(fieldHTML); // Add field html
    }
});
$(wrapper).on('click', '.remove_button', function(e){ //Once remove button is clicked
    e.preventDefault();
    $(this).parent('div').remove(); //Remove field html
    x--; //Decrement field counter
});
});
</script>

我希望每当用户点击add按钮时，都会显示相同的下拉列表，就像显示的第一个下拉列表一样。我应该如何在脚本部分实现这一目标？如何将fieldHtml填充到下拉列表中呢？

add和remove功能运作良好。只是每当有一个添加时，它应该显示下拉列表。

非常感谢你的帮助。

Answer 1

有一种解决方法可以帮助您。您可以选择多行选择，而不是想要重新打开下拉列表：

<select name="field_name[]" value="" id="drop2"  style="color:black;" size="10">

使用size标记上的select属性，您将无法使用弹出窗口下拉列表，但您将看到一个始终可见的下拉元素。

在代码点火器php

1 个答案: