Question

我有一个选择下拉列表，我想做一些当用户在选择下拉列表中选择值时，所选文本进入一个输入框（我可以隐藏并可以发布）。

到目前为止我有这个代码：

<select name="klant" id="selectList" style="width: 250px">>
        <option value="0000">---Select Customer---</option>
        <?php echo $options;?>
</select>
<input type="text" id="mytext">

我有以下javascript来完成这项工作，但这不起作用。没有任何东西插入输入框。

<script type="text/javascript">// <![CDATA[
$('#selectList').val();
$('#selectList :selected').text();
var foo = $('#selectList :selected').text();
document.getElementById("mytext").value = foo ;
// ]]&gt;
</script>

我做错了什么？

Answer 1

你错过了onChange事件列表器

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

            $( "#selectList" ).change(function() {

            $('#selectList').val();
            $('#selectList :selected').text();
            var foo = $('#selectList :selected').text();
            document.getElementById("mytext").value = foo ; 
        });

        })


</script>
</head>
<body>
    <h1>Hello, World!</h1>
    <select name="klant" id="selectList" style="width: 250px">
        <option value="0000">---Select Customer---</option>
        <option value="0001">asadad</option>
</select>
<input type="text" id="mytext">
</body>
</html>

Answer 2

你使用jquery onchange事件。

＆＃13;

$('#selectList').change(function(){
  $("#mytext").val($(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="klant" id="selectList" style="width: 250px">>
        <option value="0000">---Select Customer---</option>
        <option value="0001">1</option>
        <option value="0002">2</option>
</select>
<input type="text" id="mytext">

＆＃13;

Answer 3

你错过了改变选择的听众。

当代码就在那里时，它将在加载开始时运行。

我添加了.change事件，因为每次选择更改时它都会运行您的代码。我没有改变你的任何代码，我只是将它插入到监听器中。

您的选择中还有一个额外的>。

$('#selectList').change(function(){
$('#selectList').val();
$('#selectList :selected').text();
var foo = $('#selectList :selected').text();
document.getElementById("mytext").value = foo ;
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select name="klant" id="selectList" style="width: 250px">
        <option value="0000">---Select Customer---</option>
        <option value="0001">---Select Customer1---</option>
        <option value="0002">---Select Customer2---</option>
</select>
<input type="text" id="mytext">

javascript，输入框中的选定值

3 个答案: