Question

我有一个具有边界半径的div。我试图使用Jquery检索border-radius。它除了firefox以外都在工作。

文件：

<html>
<head>
  <script src="resources/jquery/jq.js"></script>
</head>
<style>
   div{
     border-radius:30px;
     background-color:black;
     display:block;
     width:300px;
     height:300px;
   }
 </style>
 <body>
   <div id = "SelectedDiv"></div>
 </body>
</html>

$（＆＃39; #SelectedDiv＆＃39;）。css（＆＃39; border-radius＆＃39;）返回一个空字符串（＆＃34;＆＃34;）

我尝试执行以下stackoverflow页面中的指示： How do I get the border-radius from an element using jQuery?因为他们有同样的问题。然而，没有任何效果

$('#SelectedDiv').css("MozBorderRadius");

和

$('#SelectedDiv').css("-moz-border-radius-topleft");

返回undefined

Answer 1

我已尝试过这里提出的一些解决方案，但它们似乎无法正常工作，因此我尝试过这样做：

直接从小提琴中检索所有CSS属性。
检查一下。
检索＆＃34;真实姓名＆＃34;我正在寻找的物业。

尽管有人说他们有＆＃34; border-radius＆＃34;和＆＃34; -moz-border-radius＆＃34;工作，在我的情况下，他们没有在firefox 26.0

工作

- ＆GT; ＆＃34; MozBorderRadius＆＃34; ：http://prntscr.com/6dcu2z - ＆GT; ＆＃34;边界半径＆＃34; ：http://prntscr.com/6dcubd

所以，我已经检查了这篇帖子：jQuery CSS plugin that returns computed style of element to pseudo clone that element?，将它包含在我的小提琴中并查找div的每个CSS属性：

http://prntscr.com/6dcurt

因此，我发现您可以使用以下方法检索等效内容：

＆＃39; borderBottomLeftRadius＆＃39; ＆＃39; borderBottomRightRadius＆＃39; ＆＃39; borderTopRightRadius＆＃39; ＆＃39; borderTopLeftRadius＆＃39;

http://prntscr.com/6dcv90

令我困惑的是，对象似乎真的只有边界半径的这4个属性，并且似乎无法检索＆＃34;边界半径＆＃34;即使在Chrome中使用通用属性，尽管使用$('#div').css('border-radius');它确实会返回30px。

小提琴：

http://jsfiddle.net/j2zLq357/

console.log($('#SelectedDiv').css("borderBottomLeftRadius"));
console.log($('#SelectedDiv').css("borderBottomRightRadius")); 
console.log($('#SelectedDiv').css("borderTopLeftRadius")); 
console.log($('#SelectedDiv').css("borderTopRightRadius"));

（我只是记录它们，随心所欲地做任何事情，你可以通过解析所有4个属性来重建你的border-radius属性。）

希望这有帮助。

Answer 2

这似乎对我有用：

var radius = $('.my-element').css("borderTopLeftRadius");

// returns 5px

DEMO

如果您只想要数字，而不是PX，请使用parseInt()：

var radius = parseInt($('.my-element').css("borderTopLeftRadius"),10)

// returns 5

Jquery没有在firefox中检索边界半径

2 个答案: