一種具有單個輸入的方式來設置jQuery中幾個不同選項的值

Question

我會解釋我的問題。

我有多個選項和一個（或多個）輸入的選擇。 我希望這個（這些）輸入可以為我的選擇提供額外的價值。

因此，我希望使用單個輸入為每個選項提供一個附加值，並將其保留在內存中（沒有數據庫^^）。

你理解嗎 ？？ 任何想法 ？ ！

編輯：

例如 ：

<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>
<input type="text" />

我選擇了選項1，並在輸入中輸入了“確定”。

我選擇了選項3，然后在輸入“測試”中進行設置。

如果我重新選擇選項1，我發現我的值“確定”。

編輯2：輸入將是我的選擇的一種配置。 每個選項可以有1個或多個輸入。 如果我有80個選項，則輸入可以具有80個不同的值。

Answer 1

使用此版本，您可以更改輸入的值並將其保存。

您可以使用data-屬性：

例

<select id="select">
  <option value="test1">1</option>
  <option value="test2">2</option>
  <option value="test3">3</option>
</select>
<input id="textinput" type="text" />​​​​​​​​​​​​​​​​​​​

<script>
$('#select').change(function(){
    $('#textinput').val($(this).find('option:selected').val());
});
$('#textinput').keyup(function(){
    $('#select option:selected').val(this.value);
});
</script>

Answer 2

<select>
  <option text="ok">1</option>
  <option text="hello">2</option>
  <option text="test">3</option>
</select>
<input type="text" />

$(function(){
  $('select').on('change', function(){
    $('input').val($('option:selected', this).attr('text'));
  });
});

這是一個正在工作的JSFiddle

Answer 3

我相信您想使用選項的value或label屬性，有關更多信息，請參見Mozilla開發人員網絡文檔中的<select>和MDN文檔中的<option> 。

有關其用法的示例，請參見使用JavaScript獲取選項文本/值 。