jQuery的CSS邊界

好了，所以我做了，我用它來改變一個div的邊境小腳本，但它似乎沒有工作jQuery的CSS邊界

這是我的代碼

function changeBorderType(px, rr, gg, bb) { 
     $("#colorBox").css({"border": px+"px "+ getBorderType() +" rgb("+ rr +","+ gg +","+ bb +");"}); 
     console.log("border: " + px+"px "+ getBorderType() +" rgb("+ rr +","+ gg +","+ bb +");"); 
    }

輸出蔭越來越從console.log無誤

border：1px solid rgb（231,212,164）;

但在頁面上根本沒有任何效果，邊框不會改變，或者其他任何東西都是如此。

我也試過檢查元素，看看是否有任何變化左右，但它似乎還有是不是在所有

編輯沒有變化：

只是增加了，這是我目前的CSS（默認一個）

#colorBox { 
    width: 40%; 
    height: 80%; 
    background-color: rgb(0,0,0); 
    display: inline-block; 
    margin-top: 20px; 
    border: 1px solid rgb(136,104,121); 
}

來源

2016-12-25 Tomislav Nikolic

你能提供一個完整的例子嗎？你確定你在DOM中有這個元素嗎？ – Dekel

下面是一個示例小提琴，雖然它說undefined $，但這不是我自己的網頁上的情況，可能是因爲我在那裏粘貼了錯誤的東西 https://jsfiddle.net/x1dtf4og/ –

以下是對您的更新jsfiddle：https：//jsfiddle.net/x1dtf4og/1/你有jQuery丟失，你仍然在最後有分號（';'），並且''border'鍵有額外的空間。 – Dekel

這裏是修復，根據您的jsfiddle：解決

var pixelsSet = 5; 
 
var red = 10; 
 
var green = 122; 
 
var blue = 155; 
 

 
changeBorderType(pixelsSet, red, green, blue); 
 

 
function changeBorderType(px, rr, gg, bb) { 
 
    $("#box").css({"border": px+"px " +" solid "+ "rgb("+ rr +","+ gg +","+ bb +")"}); 
 
    console.log("border: " + px+"px "+" solid "+" rgb("+ rr +","+ gg +","+ bb +")"); 
 
}

#box { 
 
    width: 50px; 
 
    height: 50px; 
 
    background-color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="box"> 
 

 
</div>

問題：
1.有在邊界的值的末尾一個額外的semicolor。
2.在border密鑰（它是border）後有一個額外的空間。

來源

2016-12-25 01:45:10 Dekel

感謝隊友，上帝保佑你，聖誕快樂！ –

分號（;）不是有效的css值。你在你的最後一個值中有哪些，

1px solid rgb（231,212,164）;

所以，當前的代碼，

"border": px+"px "+ getBorderType() +" rgb("+ rr +","+ gg +","+ bb +");"

更新它，

"border": px+"px "+ getBorderType() +" rgb("+ rr +","+ gg +","+ bb +")"

樣品，

$(function() { 
 
    var style1 = "1px solid rgb(231,212,164);"; 
 
    var style2 = "1px solid rgb(231,212,164)"; 
 

 
    $('#previousColorBox').css({ 
 
    'border': style1 
 
    }); 
 

 
    $('#colorBox').css({ 
 
    'border': style2 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="previousColorBox"> 
 
    My Previous Color Box 
 
</div> 
 

 
<div id="colorBox"> 
 
    My Color Box 
 
</div>

來源

2016-12-25 01:31:26 choz

即使沒有它，它仍然是相同的 –

@TomislavNikolic從你編輯的問題來看，你實際上可以只改變'border-color'。無論如何，嘗試檢查我的示例，如果有幫助.. – choz

得到我的投票在這裏無論如何:) – Dekel

jQuery的CSS邊界

回答

相關問題