0

私はスキルの選択ボックスを作成しました..スキルがリストされています..一度選択すると、DIVの外側に追加されます..n最初に欲しいのは、それが再び選択できないことです.選択ボックスがDIVにある場合... n divに「x」がある場合..クリックすると..そのdivは削除されます...今私のポイントは. 2番目に気になるのは、「X」をクリックしてDIVの値が削除されたときです...選択ボックス内の同じ値が再びライブになります（選択できます（有効））...

これは、私がこのツッツで使用したJavaScriptです..

  <script type="text/javascript">
  var i=0;
  function generateTextbox(){
   if(i<5){
var d=document.getElementById("div");
    var skilldiv=document.getElementById("skill").value;
    d.innerHTML+="<div>"+skilldiv+"<a  class='close_notification' onclick='this.parentNode.parentNode.removeChild(this.parentNode); '>X</a></div>";
 i=i+1;
}
 }

  </script>

選択ボックスの値は動的に取得されます..

<select id="skill" name="skill" multiple="multiple" style="float:left; height:160px; width:375px;" onchange="generateTextbox();">
<?php    foreach ( $fivesdrafts as $fivesdraft ) 
{
$fivesdraft->skill_name;
$fivesdraft->skill_id;



?>
 <option value="<?php echo $fivesdraft->skill_name; ?>" onclick="this.disabled='disabled';"  > <?php echo    $fivesdraft->skill_name; ?></option>

       <?php } ?>                 
                  </select>
 }

</script>


<?php } ?>

そして、これは私の選択ボックスの値がそれらをクリックした後に来るdivです...

<div id="div"></div>
4

1 に答える 1

1

このようなものが欲しいですか: http://aloksah.org/listbox/listbox.html

jQuery コード:

// function: UnAssignment
function assignList()
{
    // loop through first listbox and append to second listbox
    $('#firstList :selected').each(function(i, selected){
        // append to second list box
        $('#secondList').append('<option value="'+selected.value+'">'+ selected.text+'</option>');
        // remove from first list box
        $("#firstList option[value='"+ selected.value +"']").remove();
    });
}
// function: UnAssignment
function unassignList()
{
    // loop through second listbox and append to first listbox
    $('#secondList :selected').each(function(i, selected){
        // append to first list box
        $('#firstList').append('<option value="'+selected.value+'">'+ selected.text+'</option>');
        // remove from second list box
        $("#secondList option[value='"+ selected.value +"']").remove();
    });
}
于 2012-06-28T13:21:39.917 に答える