Question

因此，我希望能够检查select tag选项是否存在。但是我希望能够使用data属性。我已经尝试了所有我能找到的运气。这是我的代码：

if ($("#first-select option[data-id='G']").length > 0) {

//set the option to "selected"

}

此外，完成此操作后，我希望能够将该选项标签设置为selected。我在这里想念什么？我确实尝试过attr('data-id')和.data("id")。没运气。

为了进行测试，如果以上声明为true，则我使用控制台日志发布了true，但是它始终使我为false。

编辑：我真正想做的就是在ajax成功执行后执行代码。所以这是我目前拥有的ajax的代码：

success: function(data) {

                $("#name").val(data.title);

                var sEl = $("#first-select option[data-id='G']");
                if (sEl.length > 0) {
                    sEl.attr("selected", true);
                }
                else {
                    console.log('doesnt exist!');
                }
            }

HTML：

 <select name="rating" id="first-select">
                        <option value="2" data-id="PG3">PG3</option>
                        <option value="3" data-id="PG-13">PG-13</option>
                        <option value="4" data-id="R">R</option>
                        <option value="1" data-id="G">G</option>
                        <option value="5" data-id="NC-17">NC-17</option>
 </select>

问题是我将使用data.rated来获得额定值（可能是PG，PG-13，R等），如果额定值存在于我已经拥有的选择中，则给出它选择了属性。

这似乎仍然行不通。它曾经工作过，但现在似乎不起作用。

Answer 1

似乎您只是在尝试选择data-id与数据集中返回的评分匹配的选项。似乎您所需要的就是这样（data变量作为占位符保存从ajax请求返回的数据）。

const data = {title: 'A movie', rated: 'G'}

$('#first-select [data-id="' + data.rated + '"]').prop('selected', true);

<select name="rating" id="first-select">
  <option value="2" data-id="PG3">PG3</option>
  <option value="3" data-id="PG-13">PG-13</option>
  <option value="4" data-id="R">R</option>
  <option value="1" data-id="G">G</option>
  <option value="5" data-id="NC-17">NC-17</option>
</select>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如何处理多重选择的示例：

const data = {title: 'A movie', rated: 'G,PG3,PG-13'}
const ratings = data.rated.split(',');

$.each(ratings, (index, rating) => {
  $('#first-select [data-id="' + rating + '"]').prop('selected', true);
});

<select name="rating" id="first-select" multiple>
  <option value="2" data-id="PG3">PG3</option>
  <option value="3" data-id="PG-13">PG-13</option>
  <option value="4" data-id="R">R</option>
  <option value="1" data-id="G">G</option>
  <option value="5" data-id="NC-17">NC-17</option>
</select>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

如何使用jQuery

1 个答案: