javascript – 根据选择更改选定的值

这是我想要做的：
如果用户选择“添加新”选项,我想添加一个文本框并获取用户输入并将其保存到我的帖子中.这部分正在运作.
while循环提供了我的数据库中已存在的其他选项.如果用户选择它们,我会将所选结果保存到我的帖子中.但是,我无法让这个工作.我尝试了if语句下的不同方法.我尝试设置不保存的id值.我试着做我为else语句所做的事情,但是javascript并没有在引号内解析变量,这意味着我无法将变量传递给值.我对此很新.谁能帮帮我吗.非常感谢你.

<label for="bbp_extra_field2">Your Idea</label><br>
<form>
     <select id="bbp_extra_field2"  onchange="addtextBox()">
        <option value ="new">Add New</option>;
        <?PHP 
            while ( bbp_replies() ) : bbp_the_reply();
                 $reply_id  =   bbp_get_reply_id();
                 $ideas     =   get_post_meta( $reply_id, 'bbp_extra_field2', true);
                echo "<option value='$ideas' selected>".$ideas."</option>";
            endwhile; ?>
    </select>
</form>
<div id="newidea"></div>
<script>
    var e = document.getElementById("bbp_extra_field2");
    var strUser = e.options[e.selectedindex].value;
    function addtextBox() {

        if (strUser != "new") {
            return
        }     
        else {
            document.getElementById("newidea").innerHTML = "<input type='text' name='bbp_extra_field2'>";
        }        
    }
</script>

以下代码适用于我的数据库中已有的选项,并且可以保存结果.但是,不允许我添加新值.非常感谢你.

echo '<label for="bbp_extra_field2">Idea</label><br>';
echo '<select name="bbp_extra_field2" id="field2">';
echo '<option value ="new">Add New</option>';
while ( bbp_replies() ) : bbp_the_reply();
    $reply_id = bbp_get_reply_id();
    $ideas = get_post_meta( $reply_id, 'bbp_extra_field2', true);
    echo "<option value='$ideas' selected>".$ideas."</option>";
endwhile;
echo "</select>";

解决方法:

我不确定我得到了你想做的事情,但我认为你是想做到这一点：

<label for="bbp_extra_field2">Your Idea</label><br>
<form>
     <select id="bbp_extra_field2"  onchange="addtextBox()">
        <option value ="new">Add New</option>
        <?PHP 
            while ( bbp_replies() ) : bbp_the_reply();
                $reply_id = bbp_get_reply_id();
                 $ideas = get_post_meta( $reply_id, 'bbp_extra_field2', true);
                echo "<option value='$ideas' selected>".$ideas."</option>";
            endwhile; ?>
    </select>
    <div id="newidea"></div>
</form>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>    
<script>
$("#bbp_extra_field2").change(function() {
        var Selector    =   $(this).val();
        $("#newidea").html('<input type="text" value="'+Selector+'" name="bbp_extra_field2">');
    });
</script>

jsfiddle演示：

https://jsfiddle.net/muu982tx/