清除列表视图内容

时间:2014-02-10 19:53:21

标签: javascript jquery listview jquery-mobile

我在这里创建了一个代码,通过按下按钮将数组内容存储到listview中,我的问题是列表视图内容会堆叠。我想在每次按下按钮时清除以前的listview内容,并能够再次显示更新的存储数组内容。

    <div id="MainPage" data-role="page" >

        <div data-role="content">

            <a href="#ViewPage" data-role="button" onClick="displayArray( )">RENAME</a>

        </div>

    </div>

    <div id="ViewPage" data-role="page" >

        <div data-role="header" data-position="fixed">
            <a href="#MainPage" data-role="button" data-icon="back">BACK</a>
            <h1>View Page</h1>
        </div>

        <div data-role="content">
            <ul id="viewlist" data-role="listview" data-filter="true" data-filter-placeholder="Sample Contents" data-inset="true">
                     <!-- array contents goes here -->
            </ul>   
        </div>

    </div>  

    <script>

         var sampleContent = new Array( );

        displayArray( )
        {
        //i want to place a code here that would clear the listview contents
            for(var scan=0; scan<sampleContent.length; detect++)
            {
                 //looping of the array contents into the listview  
                 $('#viewlist').append('<li><a href="#">' + sampleContent[scan] + '</a></li>').listview("refresh");
            }       
        }

    </script>

我现在遇到这个问题,提前感谢任何帮助或建议。

2 个答案:

答案 0 :(得分:1)

这应该可以胜任。只需添加所有数据,然后清空列表并附加所有字符串以获得更快的结果。

    displayArray( )
    {
    //i want to place a code here that would clear the listview contents
    var data='';    
    for(var scan=0; scan<sampleContent.length; detect++)
        {
            data+='<li><a href="#">' + sampleContent[scan] + '</a></li>';
        }
     $("#viewlist").empty().append(data);        
    }

答案 1 :(得分:0)

我最近使用过列表,我就是这样做的:

displayArray( )
    {
    //Emptys viewlist
    $('#viewlist').empty();
    //i want to place a code here that would clear the listview contents
        for(var scan=0; scan<sampleContent.length; detect++)
        {
             //looping of the array contents into the listview  
             $('#viewlist').append('<li><a href="#">' + sampleContent[scan] + '</a></li>');
        }  
        //Update list  
        $("#viewlist").listview("refresh");   
    }

你必须清空,追加然后更新。