2014-10-10 45 views
1

Fiddle Example通過使用「|」的數據屬性查找元素作爲分隔符

HTML標記:

<div data-id='23|24|25'></div> 
<div data-id='29|30|31'></div> 

腳本:

var array = [ 
    { 
    "mid": "24" 
    }, 
    { 
    "mid": "26" 
    }, 
    { 
    "mid": "28" 
    }, 
    { 
    "mid": "29" 
    }, 
    { 
    "mid": "30" 
    }, 
    { 
    "mid": "31" 
    } 
]; 
var item_html =""; 

$.each(array,function(i,k) { 
    item_html = '<h3>'+k["mid"]+'</h3>'; 
    $('div[data-id="'+k["mid"]+'"').append(item_html); ??????????? 
}); 

難道是可能的,如果部分找到div元素 「|」其data-id中的分隔值與mid匹配?

我想要得到這樣的輸出:

<div data-id='23|24|25'> 
    <h3>24</h3> 
</div> 
<div data-id='29|30|31'> 
    <h3>29</h3> 
    <h3>30</h3> 
    <h3>31</h3> 

回答

3

您應該使用*=選擇器(包含):

$('div[data-id*="'+k["mid"]+'"').append(item_html);

+0

我不認爲它會工作,如果數k [「中」] <10 – 2014-10-10 10:03:40

+0

哼不,這可能是正確的,其實。如果'k ['mid']'== 1,它將匹配31,21,11,10等。 – 2014-10-10 10:06:03

1

你正在尋找的結果因爲是棘手的。我有更新您的代碼。希望這會幫助你。

var array = [ 
{ "mid": "24"}, 
{"mid": "26"}, 
{"mid": "28"}, 
{"mid": "29"}, 
{"mid": "30"}, 
{"mid": "31"} 
]; 
$('[data-id]').each(function(){ 
    var $this = $(this), dataArr = $this.data('id').split('|'), i = 0; 
    for(;i< dataArr.length; i++) { 
    if(numInObjArr(array,dataArr[i])) { 
     $this.append('<h3>'+ dataArr[i] +'</h3>'); 
    } 
    }  
}); 

//function to check number in array object provided above 
function numInObjArr(objArr, num){ 
    for (var i = 0, len=objArr.length; i< len; i++){ 
    if(objArr[i]["mid"] == num) { 
     return true; 
    } 
    } 
    return false; 
} 

http://jsfiddle.net/EZ56N/73/看到工作示例

相關問題