ajax后如何在选择框中获取更新的选项属性？答案

【问题标题】：How to get updated option attribute in selectbox after ajax?ajax后如何在选择框中获取更新的选项属性？
【发布时间】：2012-06-03 16:22:47
【问题描述】：

我有一个选择框，用户可以在其中选择一个填充文本框的值，并且用户可以编辑该值（使用 Ajax）。选择框中的每个选项都有一个 id 和一个数据关键属性。我使用 JQuery 'change' 事件处理程序来使用关键数据中的值填充文本框。

<select id="actions">
  <option id="p0" data-critical="100"  value="0">Optie 0</option>
  <option id="p1" data-critical="120"  value="1">Optie 1</option>
</select>

<input type="text" id="editcritical" />

$("#actions").change(function() {
  var selected = $(this).find('option:selected');

  $("#editcritical").val(selected.data('critical'));
});

ajax-success: function(data){
  $("#p" + data.p.id).attr("data-critical", data.p.critical);
}

在 Ajax 成功时，数据关键值已更改，但当我再次选择该选项时，旧值会显示在文本框中。我尝试使用 Live 方法，但没有任何反应。 Firebug 在 data-critical 中显示更新后的值。

有什么建议可以在文本框中显示更新后的值吗？

【问题讨论】：

请给你发布改变data-critical的ajax代码。

标签： javascript jquery ajax

【解决方案1】：

$("#actions").change(function() {
  var selected = $(this).find('option:selected');

  $("#editcritical").val(selected.attr('data-critical'));
});

在你的成功函数中你应该尝试：

success: function(data){
  $("#p" + data.p.id).data("critical", data.p.critical);
}

阅读jQuery data() vs attr(data)了解更多信息。

【讨论】：

我试过了，但不行。我可以使用数据关键属性中的值设置文本框，但只能设置未更新的值。
好的，你的最后一次更新成功了！谢谢。你知道为什么用 attr 代替 data 是错误的吗？
@cooxie 我在我的问题中分享了一个链接，请查看

【解决方案2】：

你试过了吗：

$("#editcritical").attr("data-critical");

【讨论】：

我可以从 data-critical 获取和更新值。问题是，当 Ajax 调用后数据关键值发生更改时，我再次选择更新后的数据关键值选项时，文本框中显示的是旧值而不是新值。
您的进一步代码是否在 ajax 调用的 .done/.success-method 中？
这就是为什么你应该替换 $("#editcritical").val(selected.data('critical'));与 $("#editcritical").attr("data-critical");按照建议。
@Abhijit: #editcritical 没有属性“数据关键”，数据关键是来自选择框选项的属性
@cooxie 抱歉，我没有注意到 select 或 option 的 id，只是指使用 attr 而不是 data。