Question

我有一个使用jquery的渲染html，当我测试它时，我尝试console.log选择下拉列表的选定值，但我无法得到它。你能告诉我我的代码有什么问题，或者为什么它没有记录所选的值？

$(document).ready(function() {

      //date forms
          $("#datetypediv").html("<select required name='date_select' class='form-control' id='date_select_off'>"
                                  + "<option val='daily'>Daily</option>" +
                                    "<option val='monthly'>Monthly</option>" +
                                    "<option val='quarterly'>Quarterly</option>" +
                                    "<option val='annually'>Annually</option>" + "</select>");

        if($('#date_select_off option:selected').val() == "daily") {//value attribute
          console.log('daily');
        }

});

整件事是一个错字

<option value=""></option>

Answer 1

这是正确的HTML语法

<option value=""></option>

Answer 2

请检查this fiddle。

将条件daily更改为Daily。

代码：

if($('#date_select_off option:selected').val() == "Daily") {//value attribute
  console.log('daily');
}

$("#datetypediv").html("<select required name='date_select' class='form-control' id='date_select_off'>"
                              + "<option val='daily'>Daily</option>" +
                                "<option val='monthly'>Monthly</option>" +
                                "<option val='quarterly'>Quarterly</option>" +
                                "<option val='annually'>Annually</option>" + "</select>");

    if($('#date_select_off option:selected').val() == "Daily") {//value attribute
      console.log('daily');
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="datetypediv">

</div>

Answer 3

您与使用option attribute而不是.attr('val')的{{1}}匹配。如果您需要匹配val()。请更改语法val()

<option value="daily"></option>

$(document).ready(function() {

      //date forms
          $("#datetypediv").html("<select required name='date_select' class='form-control' id='date_select_off'>"
                                  + "<option val='daily'>Daily</option>" +
                                    "<option val='monthly'>Monthly</option>" +
                                    "<option val='quarterly'>Quarterly</option>" +
                                    "<option val='annually'>Annually</option>" + "</select>");

        if($('#date_select_off option:selected').attr('val') == "daily") {//value attribute
          console.log('daily');
        }

});

Answer 4

您正在创建dom元素，因此不能通过使用id直接获取值。你可以这样打电话。

$(document).on('change','#date_select_off',function(){
    if($(this).val() == "daily") {
      console.log('daily');
    }
})

Answer 5

您正在文档就绪函数中运行所有这些代码，因此它会在插入后运行值检查器，因此，如果您在选择器$('#date_select_off option:selected').val()中有以下代码，:selected它没有指向任何元素，因为没有选项具有选定的属性。

我认为您应该拥有<option value="#" selected></option>才能在此控制台日志中获取值

在jquery中获取呈现的html的id

5 个答案: