2011-03-12 84 views
1

好吧,我正在製作一個「一週末」滑塊。基本上這是爲我的客戶,這是我需要儘可能簡化發佈過程的原因。顯示具有最大價值的DIV

現在它只是一個4格的滑塊:http://juuso.kivinen.org/tofw/ 這不是最新的版本,因爲我還沒有時間更新它(服務器版本)。

所以基本上(對不起,很長的介紹)我的問題是: 我如何使jquery從外部html文件加載第4個divs? 或者我應該移動到PHP?

我的代碼的基本結構是:

<div id="slider"> 
<div id="row"> 
    <div id="EXTERNAL CONTENT1"></div> 
</div> 
<div id="row"> 
<div id="EXTERNAL CONTENT2"></div> 
</div> 
<div id="row"> 
<div id="EXTERNAL CONTENT3"></div> 
</div> 
<div id="row"> 
<div id="EXTERNAL CONTENT4"></div> 
</div> 
</div> 
+2

非唯一ID是一個壞主意。這將是一個跨域html文件嗎? – kjy112 2011-03-12 15:10:50

+2

實際上,非唯一的「id」值是無效的標記,除了是一個壞主意之外:-)您應該使用「class」值來對元素進行分類。 「id」屬性用於分配**唯一的**標識符。 – Pointy 2011-03-12 15:12:52

+0

建議您不要使用可能會導致您的DOM選擇器失敗(如果您使用的是jQuery)的同一個'id',也不鼓勵在ID中使用空格。 – 2011-03-12 15:13:04

回答

1

這可以通過使用lt()load()來完成。 HTML)。

+0

謝謝兄弟!你的例子在我的電腦上不太適用,不知道爲什麼。我選擇了你的答案,因爲你包含了它(4)的一部分。我用:第n個孩子,但你給了我這個想法。謝謝你,謝謝你,謝謝你! – Deus 2011-03-12 16:46:09

+0

不客氣!你想要第四個* div嗎?由於某種原因,我把你的問題解讀爲想要前四名。哎呀。但是:是的:['nth-child()'](http://api.jquery.com/nth-child-selector/)肯定會選擇第四個=)並感謝您的接受和最高票! =) – 2011-03-12 17:02:22

+0

我希望前四個顯示在滑塊中,所以它很容易更新。 http://juuso.kivinen.org/tofw – Deus 2011-03-12 18:36:55

1

沒有更多的信息,一個完整的答案是不可能的,但你應該看的jQuery的.load()方法。您可以加載部分外部文件。 http://api.jquery.com/load/

例如:

$('#EXTERNAL_CONTENT1').load('tips.html #external1') 

你會想從什麼樣子加載文件的結構?你的客戶是否會不斷追加到該文件?

1

我希望你已經設置了一些代碼在你的服務器以服務於EXTERNALCONTENT

然後

$.get("urlToGetEXTERNALCONTENT",function(data){ 
$("#EXTERNALCONTENT4").html(data); 
}); 
+0

這隻會顯示第四個div。 – Trevor 2011-03-12 15:38:40

+0

我認爲這很明顯,你應該爲每個DIV編寫單獨的代碼..只是節省了一些空間 – 2011-03-12 15:42:10

+0

那麼如果外部文件包含所有「一週的提示」呢?所以它總是加載最近的4個?也就是我想到的使用load的html – Deus 2011-03-12 15:47:25

1

您可以使用「.load()」方法採摘內容進行加載的文件。你的情況:

$('#container').load('path/to/page.html #divContainer div:lt(4)'); 

概念的示範:http://davidrhysthomas.co.uk/play/loadDemo2.html(原始版本:訪問http //:davidrhysthomas.co.uk/play/loadDemo

$('#placeToPutStuff').load(yourUrl + ' #slider', function() { /* ... */ }); 
+0

頂部的4,只是沒有看到它。謝謝你的提示。外部文件將被結構化爲div。我只是讓jquery爲每個div加載每個部分等。謝謝,我現在可能已經明白了。我稍後會給你點。 – Deus 2011-03-12 15:19:12