讓每一個UL元素的ID特定類

目標：從名爲SBUpdater讓每一個UL元素的ID特定類

目的的UL類獲取值的特定HTML元素UL的id：我的程序包含幾個服務器的URL和解析的具體信息，我需要從每個服務器的網址。 ul的每個id都包含一個服務器url的值。我需要採用這個ID值，以便我可以更新該特定的ul標籤並更新屏幕上的內容（無需刷新頁面）。

在PHP文件我有以下幾點：示例代碼：

<ul id="http://server1.com" class="SBUPdater"> 
    <li> ... </li> 
</ul> 

<ul id="http://server2.com" class="SBUPdater"> 
    <li> ... </li> 
</ul>

所有我需要的是獲得價值從UL標籤這個ID的方法。已知：

標記= UL
類= SBUpdater
ID =？

我想要的是檢索每個ul的id值，取所有ul id的值，然後用它們執行一個函數，然後每10秒重複一次該過程。

來源

2010-11-04 Rahul

您使用jQuery和原型標籤。這是否重要？ – clockworkgeek 2010-11-04 21:48:57

有了原型庫，你會做這樣的：

$$('.SBUPdater').each(function(){ 
    new Ajax.PeriodicalUpdater(this, this.getAttribute('data-url'), { 
     frequency: 10 // every 10 seconds 
    }); 
});

每個ul元素將使用data-url（不id）屬性以持有的網址您服務器腳本。該腳本將返回適當的ul元素的新內容。

_{感謝尼克Craver優秀建議}

來源

2010-11-04 21:43:58 clockworkgeek

您可以使用.map()，雖然你的ID是無效的，就像這樣：

var idArray = $(".SBUPdater").map(function() { return this.id; }).get();

我雖然使用數據屬性，像這樣：

<ul data-url="http://server1.com" class="SBUPdater">

而且這樣的腳本：

var urlArray = $(".SBUPdater").map(function() { return $(this).attr("data-url"); }).get();

或者，如果你使用jQuery 1.4.3+

var urlArray = $(".SBUPdater").map(function() { return $(this).data("url"); }).get();

來源

2010-11-04 21:36:42

+1也適用於第二部分。正確的斜槓（如URL中所示）無論如何都是無效的字符，無論如何都是[按照規範]（http://www.w3.org/TR/html4/types.html#h-6.2）（有效字符符合模式'[A-Za-z] [A-Za-z0-9 \ -_ :.] *'）。 – BoltClock 2010-11-04 21:39:15

很好地使用數據屬性。 – clockworkgeek 2010-11-04 21:48:24

在jQuery中，這將是那麼容易，因爲：

var ids = $('.SBUPdater').map(function(el) { 
    return el.id; 
}); 

console.log(ids); // ids contains an array of ids

做一些與這些ID每10秒你可以setInterval：

window.setInterval(function() { 
    $.each(ids, function(id) { 
    console.log(id); 
    }); 
}, 10 * 1000);

來源

2010-11-04 21:36:53

你應該使用'.each（）'來遍歷或者返回結果來用'.map（）'創建一個數組。 – 2010-11-04 21:39:29

謝謝Nick;我注意到，只要我提交。我已經更新了我的答案。 – 2010-11-04 21:42:47

$('ul.SBUPdater').each(function(){ 
    alert(this.id); 
});

來源

2010-11-04 21:37:16 Radu

嗯，也許是這樣的：

var urls = new Array(); 
var count = 0; 
$('.SBUPdater').each(function() { 
    urls[count] = $('.SBUpdater').attr('id'); 
    count++; 
} 
for(var i = 0; i < count; i++) { 
    //do something with urls[i]; 
}

它甚至可能是each函數內。

來源

2010-11-04 21:38:01

setInterval(function(){ 
    $('ul.SBUPdater').each(function(){ 
    // use this.id 
    console.log(this.id); 
    }) 
}, 10000);

這應該做到這一點..

來源

2010-11-04 21:39:32

你濫用的ID的功能。不要通過id傳遞鏈接，你可以在ul之前或之後嘗試隱藏的輸入元素。或者，您可以將名稱空間屬性傳遞給ul。

<input id="address-1" type="hidden" name="address1" value="http://something.com/first.html" /> 
<ul class="SBUpdater">...</ul> 
<input id="address-2" type="hidden" name="address2" value="http://something.com/second.html" /> 
<ul class="SBUpdater">...</ul> 
...

而且，使用的setInterval應勸阻由於一些瀏覽器的掛的問題。在這種情況下，延遲10秒，不應該是是一個問題，但是我仍然會避免它。

setTimeout(doUpdate, 10000); 

function doUpdate() 
{ 
    $('.SBUpdater').each(function(index, element){ 
    var url = $('#address-' + (index + 1)).val(); 
    //do stuff with the url 
    }); 

    setTimeout(doUpdate, 10000); 
}

來源

2010-11-04 21:48:05 zzzzBov

我可以建議*不要*在窗體之外使用隱藏的輸入嗎？也許帶有特定'class'和'display：none'的'span'（或'li'）可以工作。但這只是我的許多語義寵物之一，完全是imho，當然。 – 2010-11-04 21:51:54

從語義上講，隱藏的輸入元素就是這樣：隱藏的輸入。輸入元素不需要是表單的子元素。如果您對使用輸入不熟悉，可以使用我在文章中提到的名稱空間屬性。你只需要定義你自己的名字空間。還有'數據'前綴，但我不知道詳細信息是什麼... – zzzzBov 2010-11-05 03:00:15

編輯：

function GetULs() { 
var ULs = document.getElementsByTagName("UL"); 
var IDs = new Array(); 
for(var i = 0; i < ULs.length; i++) { 
    if(ULs[i].className == "SBUPdater") { 
    IDs.push(ULs[i].id); 
    } 
} 
return IDs; 
}

該函數將返回所有你所尋找的元素ID的數組。然後，您可以使用該陣列來滿足您的任何需求。

來源

2010-11-04 21:48:24 Infotekka

讓每一個UL元素的ID特定類

回答

相關問題