2013-02-17 148 views
0

所以我學會了如何動態地向數組添加元素 - 如何去除它們?從陣列中動態移除元素

jQuery的

$(document).on('change blur', '.roomFac', function() { 
     var park = $("#park2").val(); 
     var lecturestyle = $("#lecture_style2").val(); 
     var roomstructure = $("#room_structure2").val(); 
     var groupsize = $("#groupSize2").val(); 
     var facilities = ""; 
     $('select[name*=roomFac]').each(function() { 
      facilities += $(this).val(); 
      facilities += ","; 
     }); 
     var dataString = 'park=' + park + '&' + 'lecturestyle=' + lecturestyle + '&' + 
      'roomstructure=' + roomstructure + '&' + 'groupsize=' + groupsize + '&' + 
      'facilities=' + facilities; 
     $.ajax({ 
      type: "POST", 
      url: "process_timetableMon2.php", 
      data: dataString, 
      cache: false, 
      success: function (html) { 
       $('#mon').html(html); 
      } 
     }); 
    }); 

process_timetableMon2.php

$array = explode(",", $_POST["facilities"]); 

for($i = 0; $i < count($array)-2; $i++){ 
    echo $array[$i].'<br>'; 
} 

我已上載這裏的一些代碼:http://jsfiddle.net/kfm5b/3/

+0

我覺得你很容易讓數組與DOM元素混淆..實際上我很困惑自己。你究竟想要做什麼? – kjetilh 2013-02-17 15:23:17

+0

@kjetilh當用戶點擊Add按鈕時,我在process_timetableMon2.php中爲服務器端處理創建一個數組。我想在用戶點擊process_timetableMon2.php中的Remove按鈕時刪除數組 - 我知道迄今爲止,這涉及到更新變量** facilities **。 – 2013-02-17 15:24:36

+0

Aha,所以你的意思是使用Ajax更新數組:)我建議你只使用一個下拉菜單(或'select'標籤)並設置屬性'multiple =「multiple」'以便可以選擇多個項目。 – kjetilh 2013-02-17 15:39:21

回答

0

而是動態地創造更多的下拉菜單中,我建議你,而保持簡單並堅持一個下拉菜單與multiple="multiple"屬性。

<select class="roomFac" name="roomFac" id="roomFac" multiple="multiple"> 
    <option selected="selected" value="">Any</option> 
    <option value="opt1">Opt 1</option> 
    <option value="opt2">Opt 2</option> 
</select> 

在JavaScript中,您不再需要遍歷所有下拉菜單及其選定的項目值。爲了簡單起見,我保留了大部分結構,但我建議您將值存儲在對象中,而不是手動構建數據字符串。這更加優雅,並且更容易傳遞數組,就像一個字符串一樣,您必須使用多個字符串array[]=...

$(document).on('change blur', '.roomFac', function() { 
    var park = $("#park2").val(); 
    var lecturestyle = $("#lecture_style2").val(); 
    var roomstructure = $("#room_structure2").val(); 
    var groupsize = $("#groupSize2").val(); 
    var facilities = $('#roomFac').val().join(','); 
    var dataString = 'park=' + park + '&' + 'lecturestyle=' + lecturestyle + '&' + 
     'roomstructure=' + roomstructure + '&' + 'groupsize=' + groupsize + '&' + 
     'facilities=' + facilities; 
    $.ajax({ 
     type: "POST", 
     url: "process_timetableMon2.php", 
     data: dataString, 
     cache: false, 
     success: function (html) { 
      $('#mon').html(html); 
     } 
    }); 
});