如何用ajax实现mui下拉列表

如何用ajax实现mui下拉列表,第1张

<script>

mui.init({

swipeBack:

false,

pullRefresh:

{

container:

'#pullrefresh',

down:

{

callback:

pulldownRefresh

}

}

})

/**

* 下拉刷新具体业务实现 */

var

last=-5,amount=5

function

pulldownRefresh()

{

last =last+amount

var

table =

document.body.querySelector('.mui-table-view')

var

cells =

document.body.querySelectorAll('.mui-table-view-cell')

mui.ajax({

type:

"post",

dataType:

"json",

url:

"http://localhost/amazeui/data.php?action=item",

data:

"last="+last+"&amount="+amount,

complete :function(){$("#load").hide()},

success:

function(msg){

var

data =

msg

var

tmp=''

$.each(data,

function(i,

n){

var

li =

document.createElement('li')

li.className

=

'mui-table-view-cell'

li.innerHTML

=

'<a class="mui-navigate-right">'

+

n.itemname

+

'</a>'

//下拉刷新,新纪录插到最前面;

table.insertBefore(li,

table.firstChild)

})

}

})

mui('#pullrefresh').pullRefresh().endPulldownToRefresh()

//refresh completed

}

if

(mui.os.plus)

{

mui.plusReady(function()

{

setTimeout(function()

{

mui('#pullrefresh').pullRefresh().pullupLoading()

},

1000)

})

}

else

{

mui.ready(function()

{

mui('#pullrefresh').pullRefresh().pullupLoading()

})

}

</script>

1、首先确认一下,返回的obj是对象数组还是json串,如果是对象数组,那么你的用法应该是没有问题的,如果是json串,你需要用varlist=eval("("+obj+")")将其转换为对象数组,然后再取list.length。

2、如果是字符串的话,应该是没有问题的,下面代码完全复制到一个新网页中试试:

<!DOCTYPEhtml>

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type"content="text/htmlcharset=utf-8"/>

<title></title>

</head>

<body>

<buttononclick="showlength()">读取</button>

<scripttype="text/javascript">

functionshowlength(){

varobj="[{'device':'2014年','geekbench':'1'},{'device':'2015年','geekbench':'8'}]"

varlist=eval("("+obj+")")

alert(list.length)

}

</script>

</body>

</html>

3、也可以考虑JSON,或者XML把返回XML文档,如:<?xmlversion="1.0"?><books><bookid="0001"><name>Thik</name></book><bookid="0002"><name>Thik344</name></book></books>然后用Javascript解析这段XML,按照你想要的方式呈现在页面。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11712158.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-18
下一篇2023-05-18

发表评论

登录后才能评论

评论列表(0条)

    保存