Question

我有一些jQuery将选定的跨度转换为标签。

我现在遇到的问题是我需要添加for =＆＃34;＆＃34;所以它作为一个按钮工作（我使用单选按钮，输入隐藏，所以它只是一个盒子 - 因此标签需要输入的ID才能工作）。我知道我需要创建一个变量，但我不确定如何编写它。

我需要的（如果我错了，请纠正我）是一个变量，可以为{＆＃34}创建<label>标记+＆＃34;使用＆＃34;＆＃34;。

中前一个输入的id

现在这些单选按钮是通过CMS使用的模块引入的，所以我不能每次都将ID名称本身定位为不同并由CMS生成。因此，js需要定位前一个/父母＆＃39;输入标签。

所以这就是我在js运行后需要最终代码的样子：

<div class="wrapper">
<input type="radio" id="radio1" name="radios" value="SML">
   <label for="radio1">Small</label>
<input type="radio" id="radio2" name="radios" value="MED">
   <label for="radio2">Meduim</label >
<input type="radio" id="radio3" name="radios" value="LRG">
   <label for="radio3">Large</label >
</div>

请帮忙！

＆＃13;

</script>
  <script type="text/javascript"> 
  $( document ).ready(function() {
    jQuery.each($(".wrapper span"), function() {
    $(this).replaceWith("<label>" + $(this).text() + "</label>");
    });
  });
</script>

＆＃13;

input[type=radio] {
    display:none; 
    margin:10px;
}

input[type=radio] + label {
    display:inline-block;
    margin:0;
    padding: 8px 15px;
    background-color: #eeeeee;
    border-color:none;
	text-transform:uppercase;
	color:#BDBDBD;
	cursor:pointer;

}

input[type=radio]:checked + label { 
   background-image: none;
    background-color:#EBE300;
	color:#454545;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="wrapper">
	<input type="radio" id="radio1" name="radios" value="SML">
       <span>Small</span>
	<input type="radio" id="radio2" name="radios" value="MED">
       <span>Meduim</span>
	<input type="radio" id="radio3" name="radios" value="LRG">
       <span>Large</span>
</div>

＆＃13;

Answer 1

只需将js更改为

即可

  $( document ).ready(function() {
    jQuery.each($(".wrapper span"), function() {
    var input_id = $(this).prev().attr("id");
    $(this).replaceWith("<label for='"+input_id+"'>" + $(this).text() + "</label>");
    });
  });

将获取上一个节点的id并将其添加到标签“for”属性

Answer 2

您应该执行以下操作

<script type="text/javascript"> 
$( document ).ready(function() {
var i = 1;
jQuery.each($(".wrapper span"), function() {
      var id = "radio"+i;
      $(this).replaceWith("<label for='radio"+id+"'> " + $(this).text() + "</label>");
      i++;
   });
});
</script>

记住迭代函数;）

jQuery将<span>更改为<label>并添加for =＆＃34;＆＃34;使用之前的<input /> id

2 个答案: