Question

我正在编写表格并在这里有这些chekbox：

 <div class="thumb1" >
       <label for="ltype"><img class="img" src="images/my1.jpg"  /></label>
       <input type="checkbox" class="chk"   name="ltype[]" id="ltype" value="word" required /><hr> <center><p><strong>Word Mark Logo</strong>
 </div>

 <div class="thumb1" >
      <label for="letter"><img class="img" src="images/my2.jpg"  /></label>
      <input type="checkbox" class="chk"   name="ltype[]"  id="ltype" value="letter" /><hr> <center><p><strong>Letter Mark Logo</strong></p></center>
 </div>

 <div class="thumb1">
      <label for="emblerm"><img class="img" src="images/my3.jpg"  /></label>
      <input type="checkbox" class="chk"   name="ltype[]" id="ltype" value="emblerm" /><hr> <center><p><strong>Emblerm Logo</strong></p></center>
 </div>

问题是我需要可以选择我的复选框上的图像，如果我点击它们而不更改我的复选框的ID，由于javascript代码，id必须相同。我可以使用什么代替<label for="">代码？

为什么同样的id会看到这个：

<script type="text/javascript">
function logotype() {
    var group = document.newlogo.ltype;
    for (var i=0; i<group.length; i++) {
        if (group[i].checked)
            break;
    }
    if (i==group.length)
        return alert("Please select 1 to 3 Logo Types");
}
</script>

提前感谢任何想法

Answer 1

这里有一些问题..

首先，假设ID是唯一的，因此如果您使用ID并动态操作它，例如样式。该风格将适用于其他ID。

我的建议是使用课程。如果你的代码没有使用类，那么让它工作！

这是你从我这里获得的所有帮助。

＆＃13;

$(document).ready(function() {
  $("label").on('click', function() {
    $(this).children("img").toggleClass('active');
  });
});

＆＃13;

.hide {
  display: none;
}

img {
  border-top: 2px solid rgba(102, 170, 255, 0);
  border-left: 2px solid rgba(102, 170, 255, 0);
  border-right: 2px solid rgba(102, 170, 255, 0);
  border-bottom: 2px solid rgba(102, 170, 255, 0);
}

.active {
  border-top: 2px solid rgba(102, 170, 255, 0);
  border-left: 2px solid rgba(102, 170, 255, 0);
  border-right: 2px solid rgba(102, 170, 255, 0);
  border-bottom: 2px solid rgba(102, 170, 255, 1);
}

＆＃13;

<link type='text/css' rel='stylesheet' href='http://necolas.github.io/normalize.css/3.0.1/normalize.css'/>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<label for="img1">
  <img src="http://ts1.mm.bing.net/th?id=R2skhroaNe%2b865q6n9cxDoQg60f3G4ZX2nb4KUkCPmolQ&w=135&h=135&c=7&rs=1&qlt=90&pid=1.9">
</label>
<input type="checkbox" id="img1">

<label for="img2">
  <img src="http://ts1.mm.bing.net/th?id=RhpQjwU5DUZo1Rw%2fsJyaoZA1ffuNKdpTJ%2bT5pQkMTbjUQ&w=135&h=135&c=7&rs=1&qlt=90&pid=1.9">
</label>
<input type="checkbox" id="img2">

<label for="img3">
  <img src="http://ts1.mm.bing.net/th?id=RVifPWx3AufqCw21DOl1YjwlZlAmWOIenplPjQ8AalonA&w=135&h=135&c=7&rs=1&qlt=90&pid=1.9">
</label>
<input type="checkbox" id="img3">

<label for="img4">
  <img src="http://ts1.mm.bing.net/th?id=RgqVmxiIgHNkWlfImUiZBYg4Kg5hrQ0vW3pKcpUsOcQZQ&w=135&h=135&c=7&rs=1&qlt=90&pid=1.9">
</label>
<input type="checkbox" id="img4">

＆＃13;

如何在不更改ID的情况下选择标签？

1 个答案: