2016-04-06 11 views
0

私は選択可能なリストを持っています。たとえば、そのリストで3つの項目を選択した後、確認ボタンをクリックして配列にli要素を追加したいとします。他のアイテムを選択した場合は、その配列にも追加したいと思います。li要素を配列に入れたい

$(document).ready(function() { 
 
    $("#add").on("click", function(e) { 
 
    $("#list").append("<li>" + $("#prenume").val() + " " + $("#nume").val() + "</li>"); 
 
    return false; 
 
    }) 
 

 
    $(function() { 
 
    $("#list").selectable(); 
 
    }); 
 

 
    $("#confirm").on("click", function() { 
 
    }); 
 
});
#feedback { 
 
    font-size: 1.4em; 
 
} 
 
#list .ui-selecting { 
 
    background: #FECA40; 
 
} 
 
#list .ui-selected { 
 
    background: #F39814; 
 
    color: white; 
 
} 
 
#list { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 20%; 
 
} 
 
#list li { 
 
    margin: 3px; 
 
    padding: 0.4em; 
 
    font-size: 1.4em; 
 
    height: 18px; 
 
} 
 
li:hover { 
 
    cursor: pointer; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form> 
 
    Prenume 
 
    <input type="text" id="prenume"></input> 
 
    Nume 
 
    <input type="text" id="nume"></input> 
 
    <select> 
 
    <option value="1">1</option> 
 
    <option value="2">2</option> 
 
    <option value="3">3</option> 
 
    <option value="4">4</option> 
 
    <option value="5">5</option> 
 
    </select> 
 
    <button id="add">Add</button> 
 
</form> 
 

 
<ul id="list"> 
 
</ul> 
 

 
<ul id="confirmed_list"> 
 
</ul> 
 
<button id="confirm">Confirm</button>

+0

コードを理由に動作していませんjquery-uiの –

答えて

0

私はあなたが、配列あとがきに行うために探しているかわからないんだけど、あなたはこのような何かを試みることができる:

<script> 
    $(document).ready(function() { 

     var tempArray = Array(); 

     $("#add").on("click", function (e) { 
      var prenume = $("#prenume").val(); 
      var nume = $("#nume").val(); 
      var both = prenume + " " + nume; 

      $("#list").append("<li>" + both + "</li>"); 
      tempArray += both; 
      return false; 
     }) 

      // This was not working so I commented it out for now 
      // $(function() { 
      // $("#list").selectable(); 
      // }); 


     $("#confirm").on("click", function() { 
      $("#confirmed_list").append(tempArray); 
      tempArray = ""; 
     }); 
    }); 
</script> 
関連する問題