1

可能重复:
使用 jQuery 添加其他数据以选择选项

除了使用“值”属性并使用标记来拆分内容之外,有没有办法将多个值分配给单个 HTML 元素?

我想做这样的事情:

<select id="car_model">
  <option value="1" value2="seddan" value3="Volvo">Volvo S60</option>
  <option value="2" value2="compact" value3="Saab">Saab s93</option>
  <option value="3" value2="convertible" value3="Mercedes">Mercedes SLK</option>
  <option value="4" value2="compact" value3="Audi">Audi 3</option>
</select>

如何使用 jQuery 检索所选选项的所有值?

4

2 回答 2

1

有几件事浮现在脑海中。正如您所暗示的,您可以value使用某种分隔符将元素中的所有数据包括在内,如下所示:

<option value="1,seddan,Volvo">Volvo S60</option>

另一种选择是使用数据注释:

<option value="1" data-value2="seddan" data-value3="Volvo">Volvo S60</option>

您选择哪个很大程度上取决于您将如何使用它。如果您提供有关您计划如何使用数据的更多细节,我可以更新此答案。

要在第一种情况下检索数据,它看起来像这样:

var values = $('#car_model').val().split(',');
console.log( values[0] );  // prints 1
console.log( values[1] );  // prints "seddan"
console.log( values[2] );  // prints "Volvo"

在第二种情况下,它看起来像这样:

console.log( $('#car_model').val() );            // prints 1
console.log( $('#car_model').data('value2') );   // prints "seddan"
console.log( $('#car_model').data('value3') );   // prints "Volvo
于 2012-09-18T20:16:36.957 回答
0

您可以分配多个值并使用 attr 方法检索它们..您可以试试这个..

​$('#car_model').on('change', function() {
    var val = $(this).find('option:selected').attr('value');
    var val2 = $(this).find('option:selected').attr('value2');
    var val3 = $(this).find('option:selected').attr('value3');
    alert( 'Value - '+ val + ':: Value2 - '+ val2 + ' :: Value3 - '+ val3 ) 
});​

但我认为用标识符分隔值更有意义,也许用逗号或斜杠

检查小提琴

于 2012-09-18T20:23:51.380 回答