使用 jQuery 在局部视图中设置选定选项

Question

我的部分下拉菜单如下所示：

<select id="odStatus" class="odStatus">
  <option value="placed">Placed</option>
  <option value="shipped">Shipped</option>
  <option value"Completed">Completed</option>
  <option value="Cancelled">Cancelled</option> 
</selection>

在我的 orders.hbs 中，我检索包含状态字符串的数据

$.get("/getOrderDetail/"+ id, (data)=>{
  // ...
  $('#orderDetail').find('#odStatus value=[' + data.order.status + ']').attr('selected', 'selected');
  // ...
}

我正在尝试获取它，所以#odStatus 显示状态是什么，但我无法开始工作。

Answer 1

直接的问题是因为您的选择器假定value 是它自己的元素，例如。 <value>。相反，这应该是一个属性选择器，以select 中的option 元素为目标，并使用prop() 对其进行更新，如下所示：

$('#orderDetail').find('#odStatus option[value="' + data.order.status + '"]').prop('selected', true);

然而，值得注意的是，只需在select 上直接设置val() 即可简化逻辑。同样，find() 可以删除，因为它是多余的； id 属性在 DOM 中必须是唯一的。试试这个：

$('#odStatus').val(data.order.status);