Anahtar değer çiftlerini JQuery ile birlikte HTML <select/>'da tutuyor musunuz?

Question

JQuery'de çoklu seçenekli bir seçim verildi.

$select = $("<select></select>"); 
$select.append("<option>Jason</option>") //Key = 1 
     .append("<option>John</option>") //Key = 32 
     .append("<option>Paul</option>") //Key = 423 

Anahtar nasıl saklanmalı ve nasıl alınmalıdır?

Kimlik bir OK konumu olabilir, ancak birden çok seçimin paylaşım değerlerine sahip olsaydım (ve diğer senaryolar) benzersiz olmaz.

Teşekkür

ve TMTOWTDI ruhu içinde

.

$option = $("<option></option>"); 
$select = $("<select></select>"); 
$select.addOption = function(value,text){ 
    $(this).append($("<option/>").val(value).text(text)); 
}; 

$select.append($option.val(1).text("Jason").clone()) 
     .append("<option value=32>John</option>") 
     .append($("<option/>").val(423).text("Paul")) 
     .addOption("321","Lenny"); 

Answer 1

Lucas gibi, değer özniteliği ihtiyacınız olan şeydir. Böyle bir şey olmazdı kodunuzu kullanarak (Bir id sığdırmak hale getirmeyi seçin özniteliğini eklendi):

$select = $('<select id="mySelect"></select>'); 
$select.append('<option value="1">Jason</option>') //Key = 1 
    .append('<option value="32">John</option>') //Key = 32 
    .append('<option value="423">Paul</option>') //Key = 423 

jQuery val() yöntemini kullanarak bir değer elde etmenizi sağlar. Seçili etikette kullanmak, mevcut seçili opsiyonun değerini alır.

$('#mySelect').val(); //Gets the value for the current selected option 

$('#mySelect > option').each(function(index, option) { 
    option.val(); //The value for each individual option 
}); 

Her halükarda, sorgulamadaki her öğeyi,.

Answer 2

HTML <option> etiketi, anahtarınızı saklayabilir "değer" olarak adlandırılan bir öznitelik vardır.

ör .:

<option value=1>Jason</option> 

Bu (bunu kullanmayın) jQuery ile oynayacak bilmiyorum, ama bu yine de yararlı olmuştur.

Answer 3

HTML5 kullanıyorsanız, bir custom data attribute kullanabilirsiniz. Bu şuna benzer:

var key = $('select option:selected').attr('data-key'); 

Yoksa XHTML kullanıyorsanız, o zaman özel bir ad alanı oluşturabilirsiniz:

$select = $("<select></select>"); 
$select.append("<option data-key=\"1\">Jason</option>") //Key = 1 
    .append("<option data-key=\"32\">John</option>") //Key = 32 
    .append("<option data-key=\"423\">Paul</option>") //Key = 423 

Sonra yapabileceğini seçilen anahtarı almak için.

Anahtarların yinelenebileceğini söylediğinize göre, değer niteliğini kullanarak büyük olasılıkla bir seçenek değildir, çünkü form değerinde aynı değere sahip farklı seçeneklerden hangisinin seçileceğini anlayamazsınız.