Question

我有下拉菜单选择当前月份和年份，我正确地得到了值。

现在我需要将这些值传递给其他div

如何将下拉列表中的下拉列表选为默认值作为简单文本？

如果选择的值发生变化，它应该会改变

小提琴来描述

Dropdowns的

<select name="one" class=" select1" id="ddlYear">
    <option value="-1">Select Year</option>
    <option value="2014">2014</option>
    <option value="2013">2013</option>
    <option value="2012">2012</option>
</select>   

<select name="two" class="select2" id="ddlMonth">
    <option value="-1">Select Month</option>
    <option value="January">January</option>
    <option value="February">February</option>
    <option value="March">March</option>
    <option value="April">April</option>
    <option value="May">May</option>
    <option value="June">June</option>
    <option value="July">July</option>
    <option value="August">August</option>
    <option value="September">September</option>
    <option value="October">October</option>
    <option value="November">November</option>
    <option value="December">December</option>
</select>

javascript

var d = new Date(),
month = d.getMonth() + 1,
year = d.getFullYear();
$('.select2 option:eq(' + month + ')').prop('selected', true);
$('.select1').val(year);

$('.select2').on('change', function () {
    var selectedYear = ($("option:selected", $('.select1')).text());
    if (selectedYear != "Select Year") {
        selectedMonth = ($("option:selected", this).text());
        loadData(selectedYear, selectedMonth);
    }
});

我希望在此div（#monthValue中）中选择值

<div class="placer"> Current timeperiod is :
    <div id="monthValue"></div>
</div>

我的预期结果：当前时间段是：2014年10月

Answer 1

如果我说得对，你必须使用.text()

$('#monthValue').text(selectedYear + '  ' + selectedMonth);

Fiddle

Answer 2

$('.select2, .select1').on('change', function () {
    var selectedYear = $('.select1').val();
    if (selectedYear != "Select Year") {
        selectedMonth = $('.select2').val();
        $('#monthValue').text(selectedYear + ' ' + selectedMonth)
    }
}).trigger('change');

并使显示的值内联添加到CSS

#monthValue {
    display:inline-block;
}

http://jsfiddle.net/Spokey/k1v7ga49/4/

Answer 3

我在http://jsbin.com/kidujoxidoku/1/edit

为你做了一个jsbin

我觉得你好像在检查每个select元素的值太复杂了。只需使用jQuery＆＃39; val()函数就可以了。

代码也在下面以供参考。

var d = new Date(),
month = d.getMonth() + 1,
year = d.getFullYear(),
loadData = function(year, month) {
    $('.placer #monthValue').html(year + " " +month);
};

$('.select2 option:eq(' + month + ')').prop('selected', true);
$('.select1').val(year);



$('.select2').on('change', function () {
    var selectedYear = $('.select1').val(), selectedMonth;
    if (selectedYear != "Select Year") {
        selectedMonth = $(this).val();
        loadData(selectedYear, selectedMonth);
    }
});

Answer 4

只需检查所选数据是否存在。这是工作代码，因此您只需复制/粘贴;）

var d = new Date(),
month = d.getMonth() + 1,
year = d.getFullYear();
$('.select2 option:eq(' + month + ')').prop('selected', true);
$('.select1').val(year);

$('.select2').on('change', function () {
  if ($(".select1 option:selected") && $(this).find("option:selected"))
    var selectedYear = $(".select1").val();
    selectedMonth = $(this).val();
    $('#monthValue').text(selectedYear + ' ' + selectedMonth);
  }
});

如何将下拉列表选中另一个div中的默认值作为简单文本

4 个答案: