使用jquery到文本字段获取第一个html下拉值

Question

使用我当前的代码，我可以使用jquery轻松更改下拉列表中的html下拉值，但是我没有获得在下拉列表中选择的默认值。

这是我尝试的jQuery

$("document").ready(function () {
    $("#dropval").change(function () {
        var selectedValue = $(this).val();
        $("#data").val($(this).find("option:selected").attr("value"));
        alert($("#dropval option:selected").text());
    });
});

我尝试了下面的代码alert($("#dropval option:selected").text()); 我没有收到警报js小提琴链接

有时简单的东西也无法正常工作:)

Answer 1

这将带载值：

<select name="drop" id="dropval">
    <option selected value="first">First</option>
    <option value="second">second</option>
</select>
<input type="text" id="data" />

$("document").ready(function () {
    $("#dropval").change(function () {
        var selectedValue = $(this).val();
        $("#data").val($("#dropval").find("option:selected").attr("value"));
        alert($("#dropval option:selected").text());
    });
    console.log($(this));
    $("#data").val($("#dropval").find("option:selected").attr("value"));
});

选项2

的jsfiddle

$("document").ready(function () {   
    $("#dropval").change(function () {
        var selectedValue = $(this).val();
        $("#data").val(selectedValue);
        alert($("#dropval option:selected").text());
    });
    $("#data").val($("#dropval").val());
});

Answer 2

看一下这种可能性-通过使用focus事件获取上一个选定选项的值：

$("document").ready(function () {
    $("#dropval")
        .focus(function(){
            $("#data").val($(this).find("option:selected").attr("value"));
        })
        .change(function () {
        var selectedValue = $(this).val();
        //alert($("#dropval option:selected").text());
    });
});

更新的提琴： http : //jsfiddle.net/5bjrtfzc/4/