我需要一个关于复制所选复选框值的帮助

Question

我需要从复选框中复制选中的项目。

我无法理解如何从项目列表中删除空列表。

HTML：

<div id="grocery-list">
  <h3>Item List</h3>
  <ul>
    <li class="empty">Empty</li>
  </ul>
</div>
<form>
  <fieldset>
    <legend>Add Item</legend>
    <label for="item">Item:</label>
    <input id="item" type="checkbox" name="vehicle"  value="bike"/>I have a bike 
    <br>
    <input id="item" type="checkbox" name="vehicle" value="cycle" />I have a bicycle 
    <br>
    <input id="item" type="checkbox" name="vehicle" value="aeroplane" />I have a aeroplane 
    <br/>
    <input id="item" type="checkbox" name="vehicle" value="Car"/>I have a car

    <button>Add</button>
  </fieldset>
</form>

JS：

 $( "button" ).button();

function addToList( value ) {
    var list = $( "#grocery-list ul" );
    list.append( "<li>" + value + "</li>" );
    list.find( ".empty" ).remove();
};

$( "form" ).on( "submit", function( event ) {
    event.preventDefault();
    $( "input" ).effect( "transfer", {
        to: "#grocery-list ul",
        complete: function() {
            addToList( $( this ).val() );
            $( this ).val( "" ); 
        }
    });
});

My fiddle

先谢谢你的帮助。

Answer 1

$( "button" ).button();

function A( values ) {
    var items = $( "#grocery-items ul" );
    items.empty();
    values.each(function(){
    	items.append( "<li>" + $(this).val() + "</li>" );
    });
};

$( "form" ).on( "submit", function( event ) {
    event.preventDefault();
    $( "input:checked" ).effect( "transfer", {
        to: "#grocery-items ul",
        complete: function() {
            A( $( "input:checked" ) );
        }
    });
});

Answer 2

我编辑了你的小提琴，请在这里查看：

jsfiddle.net/7HQDK/56 /