0

私はhtmlをあまり扱っていませんが、あるリストから別のリストを選択できる2つのリストが必要です。お気に入り ：

ここに画像の説明を入力

これはhtmlコードですが、あるリストから別のリストへの選択が機能していません:

<!DOCTYPE html>
<html>
<head>
<script>
$().ready(function() {  
   $('#add').click(function() {  
    return !$('#select1 option:selected').remove().appendTo('#select2');  
   });  
   $('#remove').click(function() {  
    return !$('#select2 option:selected').remove().appendTo('#select1');  
   });  
  });
</script>
<style type="text/css" media=screen>
a {  
   display: block;  
   border: 1px solid #aaa;  
   text-decoration: none;  
   background-color: #fafafa;  
   color: #123456;  
   margin: 2px;  
   clear:both;  
  }  
  div {  
   float:left;  
   text-align: center;  
   margin: 10px;  
  }  
  select {  
   width: 100px;  
   height: 80px;  
  } 
</style>
</head>
<body>

<div>  
  <select multiple id="select1">  
   <option value="1">Option 1</option>  
   <option value="2">Option 2</option>  
   <option value="3">Option 3</option>  
   <option value="4">Option 4</option>  
  </select>  
  <a href="#" id="add">add &gt;&gt;</a>  
 </div>  
 <div>  
  <select multiple id="select2"></select>  
  <a href="#" id="remove">&lt;&lt; remove</a>  
 </div>  

</body>
</html>

私は自分の間違いが何であるかを見ていません。どんな提案でも大歓迎です。

4

2 に答える 2

4

document.ready を使用してください。間違ったコードを配置しました

交換

$().ready(function()

と

$(document).ready(function()

入れてみてください

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

jQuery ファイルが含まれていませんでした。

次のコードを使用して、オプションを削除および追加します。

$('#select1:selected').each(function(i, selected) {
    $("#select2").append('<option 
     value='+$(selected).val()+'>'+$(selected).text()+'</option>');

    $(this).remove();  
});
于 2013-03-15T13:06:14.887 に答える