jQuery CSS granicy

Question

Dobrze więc zrobiłem mały skrypt, który używam do zmiany granicy div ale nie robi wydaje się działać

To jest mój kod

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 +");"); 
    } 

Wyjście że Iam coraz od konsola.log jest poprawna:

granica: 1px bryła rgb (231,212,164);

Ale na stronie nie ma żadnych efektów, granica się nie zmienia ani nic takiego.

Próbowałem też kontroli elementu, aby zobaczyć, czy są jakieś zmiany lub tak, ale wydaje się, nie żadne zmiany w ogóle

EDIT:

Wystarczy zsumować, to mój obecny CSS (domyślne jeden)

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

Answer 1

Oto dylemat, na podstawie swojej 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>

Problemy rozwiązywane:
1. Nie był dodatkowy semicolor na końcu wartości granicy jest.
2. Zostało dodatkowe miejsce po kluczu border (było to border).

Answer 2

średnikiem (;) nie jest prawidłową wartością css. Które masz w swojej ostatniej wartości,

1px solid rgb (231,212,164);

Więc aktualna kod,

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

Aktualizacja go,

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

próbki,

$(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>