jquery - 如何将 Bootstrap 模式中的 <select> html 数据传递给 jquery

Question

我正在尝试弄清楚如何从位于模态 中的此标记传递所选值:

<div class='row'>
<div class='col-md-8'>
<form class='form-inline'>
<select class='form-control' name='sel1' id='sel1'>
      <option>1.00</option>
      <option>1.25</option>
      <option>1.50</option>
      <option>1.75</option>
      <option>2.00</option>
      <option>2.25</option>
      <option>2.50</option>
      <option>2.75</option>
      <option>3.00</option>
      <option>5.00</option>
      <option>INC</option>
      <option>DRP</option>
      <option>WDRW</option>
</select>

</div>
<div class='col-md-4' align='right'>
<input style='display: block; width: 100%;' type='button' class='btn btn-success' value='Enter Grade' onclick='enterGrade($offeringno)'' />
</div>

这是我的 jquery 代码:

function enterGrade(offering) {
  var enteredgrade = $("#myModal3 #sel1").val();
  var gradeoffering = offering;
  alertify.confirm("Enter grade?", function (e)
  { if (e) {
    $.ajax({
        url : "action.php",
        type : "POST",
        data : {
            gradeofferingPost : gradeoffering,
            enteredgrade1: enteredgrade
        },
        success : function(data) {
          alertify.alert(data);
          show_test();
        }});
      $('#myModal3').modal('toggle');
  } else {
      txt = "You pressed Cancel!";
  } });
}

从 sel1 选择(在 modal 内)获取所选选项到 javascript 函数的正确语法是什么？

Answer 1

您正在尝试访问没有值的元素的值。您正在寻找的是 .text()。如果你想获得当前选择的 option 的 text 你应该替换这个:

var enteredgrade = $("#myModal3 #sel1").val();

用这个:

var enteredgrade = $('#sel1 :selected').text();

如果您对 .val() 感兴趣，那么您必须替换

<option>1.00</option>
<option>1.25</option>
...

用这个:

<option value="1.00">1.00</option>
<option value="1.25">1.25</option>
...