我正在尝试找到一种解决动态创建表单的方法,该表单出于某种原因不提供选择列表的选项,仅提供单选和检查输入。我无法进入并更改代码,所以我很好奇是否有办法使用 jquery 将单选按钮列表转换为选择下拉列表?
例如,如果我有以下代码:
<form>
<div class="col-lg-5">
<p class="bullet"><b><font class="required" size="3" color="FF0000">* </font></b></p>
<p class="inputLabel">First Name:</p>
<input type="text" size="25" name="Text1" value="">
</div>
<div class="col-lg-5">
<input type="radio" name="gender" value="male">Male<br>
<input type="radio" name="gender" value="female">Female
</div>
<div class="col-lg-10"><p>Current Employer / Facility:</p>
<input type="text" size="25" name="Text9" value="">
</div>
</form>
有没有办法将其更改为:
<form>
<div class="col-lg-5">
<p class="bullet"><b><font class="required" size="3" color="FF0000">* </font></b></p>
<p class="inputLabel">First Name:</p>
<input type="text" size="25" name="Text1" value="">
</div>
<select name="gender">
<option value ="male">Male</option>
<option value ="female">Female</option>
</select>
<div class="col-lg-10"><p>Current Employer / Facility:</p>
<input type="text" size="25" name="Text9" value="">
</div>
</form>
最佳答案
这是一种方法:
var sel = $('<select name="gender">').append(function () {
var opts='';
$('input[name="gender"]').each(function () {
opts += '<option value ="' + this.value + '">' + this.value.charAt(0).toUpperCase() + this.value.slice(1) + '</option>';
})
return opts;
});
$('form div.col-lg-5:eq(1)').empty().append(sel);
<强> jsFiddle example
关于javascript - 有什么方法可以将单选按钮列表动态更改为选择下拉列表吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29541972/