Edit in JSFiddle

//演示ko扩展的Array操作API
var SimpleListModel2 = function (items) {
    var self = this;
    self.items = ko.observableArray(items);
    self.remove1 = function () {
        self.items.remove("item1");
    };
    self.remove2 = function () {
        self.items.remove(function (item) {
            return item.length < 4;
        });
    };
    self.removeAll1 = function () {
        self.items.removeAll(["item2", "item3"]);
    };
    self.removeAll2 = function () {
        self.items.removeAll();
    };
};
var viewModel2 = new SimpleListModel2(["item1", "item2", "item3", "item4", "item5", "item6", "7", "8"]);
ko.applyBindings(viewModel2, document.getElementById("Demo2"));

<h1>演示 KnockOut Observable Arrays 功能</h1>
<hr />
<ul>
    <li  class="Point">
    2、<b  class="PointTitle">使用<span class="KeyWord">Observable Array扩展的API</span></b><br />
        <ul class="PointDesc">
            <li>remove(someItem):从列表中移出元素</li>
            <li>remove(<span class="KeyWord">function(item) { return item.age < 18 }</span>)：可以传入过滤函数进行移除</li>
            <li>removeAll(<span class="KeyWord">['Chad', 132, undefined]</span>):直接传入要移除的数组段</li>
            <li>removeAll():移除所有数组元素</li>
        </ul>
        <div  class="PointDemo" id="Demo2">
                <select multiple="multiple" style=" width：60px; height:140px;"  data-bind="options: items"> </select>
               
                <ul>
                    <li>演示：<input type="button" data-bind="click:remove1" value="remove(元素)"></input></li>
                    <li>演示：<input type="button" data-bind="click:remove2" value="remove(过滤函数)"></input></li>
                    <li>演示：<input type="button" data-bind="click:removeAll1" value="removeAll(数组)"></input></li>
                    <li>演示：<input type="button" data-bind="click:removeAll2" value="removeAll()"></input></li>
                </ul>
        </div>
        <!--下面写一些特殊的提示信息-->
        <div class="PSFrame">
        
        </div>
        <hr />
    </li>
</ul>
<hr />

/*Demo�ļ���ʽ*/
body
{
    background-color: #e3e5d4;
}
/*  ֪ʶ��    */
.Point
{
    margin: 20px,0,0,0;
}
/*  ֪ʶ�����    */
.PointTitle
{
    color:#0d8d0d;
}
/*  �ؼ���    */
.KeyWord
{
    color:Red;
}
/*  ֪ʶ������    */
.PointDesc
{
    font-family: Arial;
    font-size: 15px;
    color:#09acb8;
}
.PointDesc li
{
    margin: 10px,0,0,0;
}
/*  ֪ʶ��Demo���    */
.PointDemo
{
    border-style:double; 
    border-color:#dcd559;
    min-height:100px;
    font-family: Corbel;
    font-size: 20px;
    color: #00174f;
}
/*  ��Ҫ������ʾ����Ϣ���    */
.PSFrame
{
    border-style: dashed; 
    border-color:#78e6ef;
    font-family: Corbel;
    font-size: 20px;
    font-style:italic;
    color: #b86c00;
}
/*  ������ʾ    */
.error {
    color:Red;
    
}
/*  **********************************************************    */
/*��Ҫǿ������ʽ*/
.Notice
{
    font-weight: bold;
    font-family:Bodoni MT Black;
    color: #cd0707;
}

/*  **********************************************************    */
/*�������ʽ*/
input[type="text"]
{
    min-width:250px;
}
select
{
    min-width:400px;
}