Question

我所拥有的是一个打开Jquery弹出窗口，其中包含一个表单。此表单有多个选项（您可以一次选择多个选项）。我正在尝试使用“countries”属性来选择多个选项（参见下面的示例）。

这个工作：

<a href="#" id="openpop"> //The link

....
//The Popup HTML
<select id="countryselection" multiple="multiple">
<option>US</option>
<option>CA</option>
<option>GB</option>
</select>

....
//The event handler
$("#openpop").click(function(){
loadPopup();
("#countryselection").val(['US', 'CA']);
});

所以上面的例子工作得很好......

这也是工作：

<a href="#" id="openpop" countries="US"> //The link with countries attribute

....
//The Popup HTML
<select id="countryselection" multiple="multiple">
<option>US</option>
<option>CA</option>
<option>GB</option>
</select>

....
//The event handler
$("#openpop").click(function(){
loadPopup();
("#countryselection").val([$(this).attr("countries"), 'CA']); //Notice the this.attr
});

问题是，我需要设置MULTIPLE国家/地区，全部来自标签的countries属性。

当我尝试它时它不起作用......

这不起作用：

<a href="#" id="openpop" countries="'US','CA'"> //The link with multiple countries

....
//The Popup HTML
<select id="countryselection" multiple="multiple">
<option>US</option>
<option>CA</option>
<option>GB</option>
</select>

....
//The event handler
$("#openpop").click(function(){
loadPopup();
("#countryselection").val([$(this).attr("countries")]); //Notice the this.attr
});

我希望你能看到我在这里想做什么。不知何故，我需要Jquery将“countries”属性作为数组，虽然我不知道如何做到这一点。

感谢您的帮助！

Answer 1

http://jsfiddle.net/V62Yq/

<a href="#" id="openpop" countries="US,CA">link</a>

<select id="countryselection" multiple="multiple">
    <option>US</option>
    <option>CA</option>
    <option>GB</option>
</select>


//The event handler
$("#openpop").click(function(e){
    e.preventDefault();
    var vals = $(this).attr('countries').split(",");
    $("#countryselection").val(vals); 
});

虽然根据您定位的html规范添加国家/地区属性是有效的，但您应该使用数据属性来获取链接标记中的“国家/地区”等信息。你可以用同样的方式访问它们。

$(selector).attr('data-countries');

<a href="#" id="openpop" data-countries="US,CA">link</a>

请参阅：http://ejohn.org/blog/html-5-data-attributes/

Answer 2

假设我们在data-countries="US, CA"

中有此属性：<a href="#" id="openpop" data-countries="US, CA"> ... </a>

我们可以通过这种方式创建一个数组：

con = $("a").data('countries');
arr = con.split(",");
alert(arr[0])

http://jsfiddle.net/jV7Cn/

Answer 3

目前还不清楚为什么要尝试使用属性存储结构化数据，但是，如果您允许定义国家/地区属性如下：

<a href="#" id="openpop" countries="US,CA">

您可以使用Javascript split函数将其转换为数组。例如：

("#countryselection").val($(this).attr("countries").split(/,/));

原始行的问题：

("#countryselection").val([$(this).attr("countries")]);

...是Javascript正在获取属性的实际字符串值$(this).attr("countries")并将其用作匿名数组的唯一元素，并传递给val()。虽然此属性的值看起来像数组语法，但您应该知道它不会被解析。只有您输入文本编辑器的Javascript源（或eval()的字符串参数）才会被解释。

使用jQuery？</select>从HTML属性（Get .attr as Array）设置多个<select>选项

3 个答案: