Question

我正在使用jquery select2插件来提示表单字段。我正在尝试访问存储在原始隐藏输入字段数据属性中的数据。我需要来自这些属性的数据，所以我可以通过Ajax将它们发送到php脚本。有没有人对如何做到这一点有任何建议？我似乎无法在谷歌或官方网站上找到答案。

谢谢

Answer 1

您还可以尝试以下操作。假设您有一个select，您可以使用jQuery中的标准数据属性语法向选项添加其他信息，请参阅jQuery data() API。

 <select id="product">
      <option value="prod_x" data-additional-info="1234X">Product X</option>
      <option value="prod_y" data-additional-info="1234Y">Product Y</option>
 </select>

现在，在您的javascript中，您可以使用.select2（＆＃34; data＆＃34;）根据api文档 - ＆＃34;获取或设置选择来获取选项元素本身。类似于val方法，但与对象而不是ids＆＃34; 一起使用。要获得选项对象本身，您必须遍历元素，即所有选定选项的数组。在下面的例子中，select不是多值可选的，所以我总是使用数组中的第一个对象，除了获取对象，我将结果包装在＆＃34; .element [0]＆＃34;在$（）中使它成为一个jQuery对象。

 // Get the selected option using select2's api...
 var selectedOption = $($("#product").select2("data").element[0]);

现在我们有了一个jQuery对象，我们可以使用jQuery data() API来检索存储在option元素上的任意数据。

 var additionalInfo = selectedOption.data("additional-info");

附加信息变量现在包含＆＃34; 1234X＆＃34;或＆＃34; 1234Y＆＃34;取决于选择哪一个。

使用此功能，您可以消除保存附加数据的隐藏输入，并将其直接绑定到所选选项。

Answer 2

就像在文档中一样：

//模板：

<select>
    <option value="0" data-foo="bar">option one</option>
</select>

//Initiate select2

$("select").select2({
    formatResult: format,
    formatSelection: format,
    escapeMarkup: function(m) { return m; }
});

//access custom data

function format(state) {
    var originalOption = state.element;
    return $(originalOption).data('foo');
}

Answer 3

我们可以获取所选选项的数据属性

var seledted = $("#selectId").select2().find(":selected");
var s = $(seledted).data("data-field");

Answer 4

我最终通过

完成了这项工作

$(".suggestive-entry").click(function() {
   var val = $(this).siblings('input:hidden').attr('data-field');
   alert(val);
});

如您所见，我使用了siblings属性来获取最接近生成click事件的select2框的隐藏输入。

Select2自定义读取自定义数据属性

4 个答案: