从下拉列表中选择选项后如何创建文本框？

I'm trying to create a drop-down list with four options such that if I select the 4th option, I want a text box created so that I can get the value typed in that box using "$_GET"

Something like this;

<select name="value">
<option value="value1">Option 1</option>
<option value="value2">Option 2</option>
<option value="value3">Option 3</option>
<!-- And a 4th one -->
</select>

And if the 4th one is selected, a box should appear like this;

<input type="text" name="firstname">

Edit;

My current code;

<script>
jQuery(function($){                      //calling the code inside braces when document loads and passing jQuery object as '$' parameter;
   $("select[name='sortby']").change(function(){        //binding an event that fires every time select value changes
      var select = $(this);              //caching select, which value was changed
      if(select.val() === "byDefindex"){     //checking if we selected the right option
          $("<input>").attr({type: "text", name: "defindex"}).appendTo(select.parent());   //creating new input element object, setting its value to "value4" and appending to select parent element or wherever you want it
      }
   });        
});
</script>




<form action="<?php $_PHP_SELF ?>" method="GET">

    Select:
    <br />
        <select name="sortby">
            <option value="playHours">Play Hours</option>
            <option value="lastLogin">Last Login</option>
            <option value="byDefindex">By Defindex</option>
        </select>
    <br />

    <input type="submit" />

</form>

If your 4th option is this:

<option value="value4">Option 4</option>

You can use jQuery to display the field. Put your field in a <div>

<div id="field"><input type="text" name="firstname"></div>

Now,

<script type="text/javascript">
$(document).ready(function(){

$('input[name="value"]').change(function(){
var v = $('input[name="value"]').val();
if(v=="value4") $('#field').show();
else $('#field').hide();
})
})

This is usually done via javascript; something like this (by using popular JavaScript library, jQuery) :

jQuery(function($){                      //calling the code inside braces when document loads and passing jQuery object as '$' parameter;
   $("select[name='value']").change(function(){        //binding an event that fires every time select value changes
      var select = $(this);              //caching select, which value was changed
      if(select.val() === "value4"){     //checking if we selected the right option
          $("<input>").attr({type: "text", name: "firstname"}).appendTo(select.parent());   //creating new input element object, setting its value to "value4" and appending to select parent element or wherever you want it
      }
   });        
});

Hope that helps. You can find more here jQuery site

I'm not certain this is what you're asking, but it seems you're wanting to add new lines to your select list?

I often do something similar to this for adding new options to lists. The first option would be 'add a new record', like this:

<select name="value">
    <option value="-1">Add New Option</option>
    <option value="value1">Option 1</option>
    <option value="value2">Option 2</option>
    <option value="value3">Option 3</option>
</select>

Note that the value for "add new" is -1... you could put anything here, but it should be something that would never show up in the other options, so your javascript knows what to do when it is selected.

Add a 'onchange' to the select box like this:

<select name="value" onchange="if(this.value == -1) addOption(this);">

Note that if the selected option is -1, then a javascript function is called. It references itself (this), so that your function knows who called it.

Then create a function that allows adding a new option:

function addOption(theSelectElement){
    // create a text box, underneath the select box:
    var newInput=document.createElement('input');
    newInput.type='text';
    theSelectElement.parentNode.insertAfter(newInput,theSelectElement);
}

You'll want to add more code to this function so that the new text field has a name and perhaps an ID.

Hope this helps, or at least points you in the right direction.