Question

我有下表，每列有两列和两个输入：

<table id="ASD" style="border:1px black solid">
<thead>
<th>Columna 1</th>
<th>Columna 2</th>
</thead>
<tbody>
  <tr name="1" style="border:1px black solid">
    <td  style="border:1px black solid" ><label>Sí</label><input type="radio" class="c1s" name="1_1">
    <label>No</label> <input type="radio" class="c1n" name="1_1"></td>
    <td  style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="1_1">
    <label>No</label> <input type="radio" class="c1n" name="1_1_2"></td>
  </tr>

    <tr name="2" style="border:1px black solid">
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="2_1">
    <label>No</label> <input type="radio" class="c1n" name="2_1"></td>
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="2_2">
    <label>No</label> <input type="radio" class="c1n" name="2_2"></td>
  </tr>
    <tr name="3">
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="3_1"><label>No</label> <input type="radio" class="c1n" name="3_1"></td>
        <td  style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="3_2"><label>No</label> <input type="radio" class="c1n" name="3_2"></td>
  </tr>

</tbody>
</table>

我会说，如果，我点击“Si＆＃39;在第一个单元格上，第二个单元格会自动标记。

这是我的JS到目前为止，我正在努力做到以下几点：当＆＃39; Si＆＃39;单击一行，找到最近的TR并获取属性名称。一旦我有了attr名称，作为每行唯一，我可以简单地找到tr并转到第二个单元格，找到类的输入＆＃39; c1s＆＃39;并将其设置为已选中。

最后一部分是我遗失的部分，因为我似乎无法从<tr>检索attr名称。

$(".c1s").click(function(){
alert("Click Si");
var id_col = $('#ASD').closest('tr').attr("name");
console.log(id_col);
alert(id_col)
})

FIDDLE ：

https://jsfiddle.net/f7cqxyLy/1/

任何人都可以帮忙吗？

Answer 1

只需找到已点击单元格的索引并修改它们即可移动到另一列。

window.onload = function () {
                    $(".c1s").click(function () {
                        var colIndex = $(this).parent().index()
                        var rowIndex = $(this).parent().parent().index()

                        var table = document.getElementById("ASD")
                        var cell= table.rows[rowIndex+1].cells[colIndex+1]
                        cell.children[1].checked=true
                    })
                }

Answer 2

你可以用这个得到最接近的tr的属性：

$(this).closest('tr').next().attr('name')

您不能将特定ID用于选择器。你必须使用'this'来使呼叫成为相对的。然后通过next（）调用获得下一个兄弟。最好在使用之前进行空检查。

Answer 3

试试这个..

<table id="ASD" style="border:1px black solid">
<thead>
<th>Columna 1</th>
<th>Columna 2</th>
</thead>
<tbody>
  <tr name="1" style="border:1px black solid">
    <td  style="border:1px black solid" ><label>Sí</label><input type="radio" class="c1s" name="1_1">
    <label>No</label> <input type="radio" class="c1n" name="1_1"></td>
    <td  style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="1_2">
    <label>No</label> <input type="radio" class="c1n" name="1_2"></td>
  </tr>

    <tr name="2" style="border:1px black solid">
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="2_1">
    <label>No</label> <input type="radio" class="c1n" name="2_1"></td>
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="2_2">
    <label>No</label> <input type="radio" class="c1n" name="2_2"></td>
  </tr>
    <tr name="3">
    <td style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="3_1"><label>No</label> <input type="radio" class="c1n" name="3_1"></td>
        <td  style="border:1px black solid"><label>Sí</label><input type="radio" class="c1s" name="3_2"><label>No</label> <input type="radio" class="c1n" name="3_2"></td>
  </tr>

</tbody>
</table>

和

$(".c1s").click(function(){
     var row = $(this).closest('tr');
     $(row).find('.c1s').each(function(){
         $(this).prop('checked',true);
     });
});

$(".c1n").click(function(){
     var row = $(this).closest('tr');
     $(row).find('.c1n').each(function(){
         $(this).prop('checked',true);
     });
});

相同的JSFiddle链接

https://jsfiddle.net/f7cqxyLy/4/

Answer 4

看看这个小提琴并玩这一行$(this).closest("td").find(".c1n").attr('checked',true); 如果你有更多的查询

https://jsfiddle.net/f7cqxyLy/5/

根据其他值连续更改单元格值

4 个答案: