Question

我有一个方形div，我想根据文本输入改变它的边界半径。例如。用户以下列形式输入这4个值：25px 90em 87px 9m。我希望当用户点击提交按钮保存该文本然后将其用作边框半径时我有这个HTML：

<div id="radius"></div>

这个css：

#radius{
   hight:10em;width:10em;
   background:aqua;
}

以及此表格：

 <input type="text" id="userSet"/>
     <button onclick="$('#radius').css($('#userSet').val())">Submit></button>

有什么想法吗？

Answer 1

要设置边框半径，请尝试以下操作：

 <input type="text" id="userSet"/><button onclick="$('#radius').css('border-radius', $('#userSet').val())">Submit></button>

Answer 2

我在你的html中修复了一些错误：

<div id="radius"></div>
<input type="text" id="userSet"/>
<button onclick="$('#radius').css('border-radius', parseInt($('#userSet').val()));">Submit></button>

fiddle

您必须使用border-radius并使用parseInt。

border-radius属性是用于设置的简写属性四个边界 - * - 半径属性。

Answer 3

你也可以尝试这个

<button onclick="$('#radius').css($('#userSet').val())">Submit></button>

Answer 4

试试这个：

<button onClick="$('#radius').css('border-radius', $('#userSet').val() + 'px');">Submit></button>

请参阅working jsfiddle此处

从输入表单设置div的边框半径

4 个答案: