Ajax和JavaScript Multiple Select onchange在3個選定項之后失敗

Question

我有一個帶有以下代碼的選擇輸入：

<select name="color" id="color" multiple class="form-control chzn-select" tabindex="8" onchange="autosave(this.id,this.value)">

它已成功發送了功能ID和選擇值，但是由於可以選擇多個項目，因此出現了問題。 我最多可以選擇3個項目，但是嘗試選擇第4個項目會使它傳遞第一個選定項目的值。 不是最近選擇的項目。 這是函數，它發送其他信息，例如標題和日期（均為文本輸入）：

function autosave(inputid,values) {
var dataObj = {};
dataObj[inputid] = values;
  $.ajax({
      type: "POST",
      url: "save.php",
      data: dataObj,
      success: function(msg) {
          $('#autosavenotify').text(msg);
          console.log('success');
      }
  })
}

HTML明智的做法是，我使用Bootstrap3進行操作，這就是我填充選擇選項的方式：

<?php
$colors = array('Red','Blue','Yellow','Purple','Green','Orange');
foreach($colors as $c) {
    $selected = '';

    if(in_array($c, $_SESSION['array']['colors'])) {
        $selected = 'selected';
    }

    echo '<option value="'.$c.'" '.$selected.'>'.$c.'</option>';
}
?>

任何想法為什么會發生這種情況？ 我的save.php頁面將所有項目成功放置在數組中，而ajax出於某種原因只是發送了不正確的值。

Answer 1

因為您已經在使用jQuery，所以最好只使用$(this).val( )從選擇中獲取選擇的選項。 這是我使用您提供的代碼提出的一個小提琴： http : //jsfiddle.net/y7NfF/1/

您可能考慮采用的另一種方法是使用jQuery的.serialize()或.serializeArray()函數在通過ajax提交數據時獲取表單的所有值。 但是，如果您想一次只做一個元素，那么您的方法就可以了。

這是這些功能的幾個鏈接：

http://api.jquery.com/serialize/

http://api.jquery.com/serializeArray/