使用jquery腳本從當前文件夾設置css圖像頁面

我有一個外部的Javascript頁面位於../Scripts/CBox/父文件夾下。位於同一文件夾中的圖像。我想從那裏設置使用Jquery的控件background-image。當我使用此代碼時，它將background-image路徑設置爲localhost:7905/ddl_arrow.png，其中localhost:7905是我的asp.net開發服務器。使用jquery腳本從當前文件夾設置css圖像頁面

function createAutoCBox(boxCtrl) { 

    $(boxCtrl).css('background-image', 'url("ddl_arrow.png")'); 
    $(boxCtrl).css('background-repeat', 'no-repeat'); 
    $(boxCtrl).css('background-position-x', '99%'); 
    $(boxCtrl).css('background-position-y', '-2px'); 
    $(boxCtrl).mousemove(jqAutoCompleteMouseMove); 
    $(boxCtrl).keyup(jqAutoCompleteKeyUp); 
    $(boxCtrl).mousedown(jqAutoCompleteMouseDown); 
}

來源

2015-06-20 Yesudass Moses

由於JS是在客戶端完成的，所以沒有辦法「在服務器上獲取當前腳本的路徑」。所以沒有簡單的方法去做你正在想的東西。

只有方法可以解決這個問題，它們都基於相同的原則：正確組織文件 - 每個資源都應該是一個URL。想想看：如果你不能可靠地告訴ddl_arrow.png存儲在哪裏，那麼瀏覽器也不能。

我認爲最好的解決方案是將所有圖像放在服務器根目錄下的[img]文件夾中。這意味着你可以用這種方式參考圖像：url(/img/ddl_arrow.png)。無論哪個JS，哪個CSS或HTML文件都需要圖像，請確保它們始終使用前面的斜線引用圖像。當然，這不僅適用於圖像，還適用於所有其他資產/資源 - 字體，視頻，音頻，甚至是HTML，CSS，JS文件本身。基本上你的服務器提供的每個文件應該以這種方式引用。

還有其他一些涉及討厭，雜亂的東西，像使用服務器端腳本來打印正在被提取到JS文件中的JS文件的位置，但我建議遠離這些方法。

來源

2015-06-20 09:15:51 light

嘗試：

$(boxCtrl).css('background-image', 'url("./Scripts/CBox/folder/ddl_arrow.png")');

來源

2015-06-20 08:32:22 Sajal

我想讓CBox作爲一個可再發行的控件。所以不能使用確切的文件夾名稱。 –

將回到這個時候，我找到了替代它。 – Sajal

你會更好，這樣做：

CSS

.my-background { 
    background-image: url("ddl_arrow.png"); 
    background-repeat: no-repeat; 
    background-position-x: 99%; 
    background-position-y: -2px; 
}

JQuery的

$(boxCtrl).addClass('my-background');

CSS總是會理解從自身到圖像文件夾的路徑，因此，如果您的結構是：

/images 
/css

背景圖像路徑將是：

../images/ddl_arrow.png

與去上一級..然後進入兄弟目錄images獲取該文件。你可以把它放在任何地方，它會工作。

值得注意的是，使用CSS樣式而不是在JQuery中添加它們更容易重用（只需將.my-background添加到需要它的HTML中）。由於功能文件中沒有樣式信息，因此它還使事情變得更好 - 未來的你（或你的隊友）會感謝你。

而且，background-position-x/background-position-y都是not standard等都不能依賴，到處background-position: x-value y-value現在比較好。

來源

2015-06-20 08:51:12

使用jquery腳本從當前文件夾設置css圖像頁面

回答

相關問題