jquery mobile 用js 動態修改元素屬性或內容
1 2 3 4 5 6 7 8 9 10 |
<ul data-role= "listview" data-inset= "true" class= "tjlist" id= "listorder" >
<li>數量<span class= "ui-li-aside" >
<div data-role= "controlgroup" data-type= "horizontal" id= "jiajian" >
<a href= "javascript:void(0)" data-role= "button" data-theme= "a" onclick= "chg(this,0)" style= "width:40px;" >-</a>
<a href= "javascript:void(0)" data-role= "button" style= "width:40px;" id= "selnum" >1</a>
<a href= "javascript:void(0)" data-role= "button" data-theme= "f" onclick= "chg(this,1)" style= "width:40px;" >+</a>
</div> </span></li>
<li>合計<span class= "ui-li-aside" >2400元</span></li>
</ul>
|
現在需要在函式chg()z中修改,對於的a標籤的值。
比如:修改第一個a標籤的data-theme為"f",修改第二個標籤的html值為2.,修改第三個a標籤的disabled為disabled。
JavaScript code ?1 2 3 |
$( ".ui-li-aside" ).eq(0).find( "a" ).eq(0).attr( "data-theme" , "f" );
$( ".ui-li-aside" ).eq(0).find( "a" ).eq(1).text( "2" );
$( ".ui-li-aside" ).eq(0).find( "a" ).eq(2).attr( "disabled" , "disabled" );
|
來自本站論壇,作者ZHHAA發的帖子,a756375788作答。此處作為收藏。
下面是自己問題處理。
HTML部分:
<div data-role="collapsible-set" data-inset="false" id="bhlist"> </div>
動態新增部分請看圖片。
js部分:
動態新增
var option = $("#bhlist").html();
for (var i = 0; i < d.length; i++) {
var options = '<div data-role="collapsible" id="bt' + i + '"><h3 onclick="loadbz(' + i + ',' + d[i].TypeID + ',\'' + d[i].Name + '\')" id="bx' + i + '">' + d[i].Name + '</h3></div>';
option = option + options;
}
$("#bhlist").html(option);
$("#bhlist").collapsibleset('refresh', true);
摺疊部分渲染
$("#bx" + j).find("a").css("color", "blue");
//$("#bx" + j).find("a").css("backgrounCcolor", "blue");//太醜了
$("#bhlist").trigger("create");
if ($("#pdbz").children().length > 1) {
$("#pdbz").empty();
}
//清除同級元素的改變
if ($("#bt" + j).prevAll().length > 0) {
$("#bt" + j).prevAll().find("h3").find("a").css("color", "black");
}
if ($("#bt" + j).nextAll().length > 0) {
$("#bt" + j).nextAll().find("h3").find("a").css("color", "black");
}