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>

もう 1 つのオプションは、データ注釈を使用することです。

<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"

2 番目のケースでは、次のようになります。

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 に答える