Question

我有一个生成的表，其中包含多行，每行包含带有复选框的前导td和带有选择列表=

的另一个td

<div class="table">
<table width="100%" class="tframe" id="table0">
<thead>
<tr class="trheadline">
    <th>Selection</th>
    <th>Repository-Tag</th>
</tr>
</thead>
<tbody>
<tr class="trow">
    <td>
        <input type="checkbox"
          value="0#298#abk_testn#l#CLEARCASE#at_web_vob"
          name="module">ModuleA
    </td>
    <td>
    <select name="cvstags">
        <option value="no_Repository">no_Repository</option>
        <option value="220607_143102110">220607_143102110</option>
        <option value="220607_09410236">220607_09410236</option>
        <option value="220507_091903814">220507_091903814</option>
    </select>
    </td>
</tr>
<tr class="trow">
    <td>
        <input type="checkbox"
          value="1#299#abk_integration#d#CLEARCASE#at_web_vob"
          name="module">ModuleB
    </td>
    <td>
    <select name="cvstags">
        <option value="220607_143102110">220607_143102110</option>
     </select>
    </td>
 </tr>
 <tr class="trow">
     <td>
        <input type="checkbox"
          value="2#301#abk_statcont##CLEARCASE#at_web_vob"
          name="module">ModuleC
    </td>
    <td>
    <select name="cvstags">
        <option value="no_Repository">no_Repository</option>
        <option value="220607_143102110">220607_143102110</option>
        <option value="220607_09410236">220607_09410236</option>
        <option value="220507_091903814">220507_091903814</option>
    </select>
        </td>
    </tr>
    </tbody>
 </table>
</div>

现在我想在选择时固定一个更改事件，但是如果选中了前导复选框，我只想开始操作，现在我有=

<script>
    $('select').change(function(){
        alert($(this).val());
    });
</script>

它给出了所选选项的值，很好，但仍有两个问题=

如何检查同一tr中的前导复选框是否已被检查？

$('select').change(function(){
 if (the leading checkbox is checked) {
    run my action..
 }
});

如果选择列表只有，则更改事件不起作用如上例子中的第二行中的一个选项，如何在这种情况下实现与变更事件类似的行为？

感谢任何提示!!

Answer 1

如何以另一种方式查看此信息，即处理复选框上的click事件，如果选中，则评估行中select的值？

$('tr.trow input:checkbox').click(function() {
    if (this.checked) {
        var self = $(this);
        self.parent().parent().find('select').val(); // value of select
    }
}

修改

以下是我粗略处理它的方法：

// use an object literal to prevent global pollution(!) var rowActions = { checkbox: function() { if (this.checked) { rowActions.doSomething(); } }, select: function() { if ($(this).parent().parent().find('input:checkbox:checked').length) { rowActions.doSomething(); } }, doSomething: function() { alert('I did something!'); } } $('tr.trow').each(function() { var self = $(this); self.find('input:checkbox').click(rowActions.checkbox); self.find('select').change(rowActions.select); });

这是一个 Working Demo 来展示它的实际效果。添加/编辑到网址以播放代码。

Answer 2

只有第二个，但看看prev方法：例如

jQuery(this).prev("td").child("input[name=module]").val() != 'undefined'

......或类似的东西

对于第二部分，您应该添加一个名为“Select one ...”的空字符串选项，可以忽略该选项，但允许在选择单个选择时触发您的行为。

事件触发时的jQuery条件操作

2 个答案: