jQuery:在更改事件时,checked属性未定义

时间:2016-08-21 12:24:38

标签: jquery checkbox onchange

我在这个主题上看到很多问题,但没有一个问题解决了我的问题。

麻烦是:我有一个复选框,当用户点击它时需要checked属性的新值。

我尝试过不同的事件传感器。("更改" ..和.change(function()..但总是返回" undefined"。 我还测试了(有警报)如果对变量的赋值再做了一次,但它们没有。只有一次。

请考虑脚本并告诉我你是否知道我做错了什么。或者,如果我应该发布更多信息。

$(document).ready(function () {
        $('#invoice_list :checkbox').on('change', function () {
            var _invoice_id;
            var _payed;
            var _sent;
            $(this).parent().siblings().each(function () {
                if ($(this).hasClass('name?ajax_invoice_id')) {
                    _invoice_id = $(this).text();
                }
                if ($(this).hasClass('name?ajax_payed')) {
                    _payed = $(this).children(':checkbox').prop('checked');
                }
                if ($(this).hasClass('name?ajax_sent')) {
                    _sent = $(this).children(':checkbox').prop('checked');
                }
            });
            alert('invoice_id: ' + _invoice_id + '\r\npayed: ' + _payed + '\r\nsent: ' + _sent);
        });
    });        

如果我检查"支付"复选框这是结果,无论新值如何("发送"同样如此):localhost says

html from razor view

<tbody class="clickable">
                    <tr>
                        <td class="name?ajax_invoice_id">85</td>
                        <td>31-10-2015 16:54:27</td>
                        <td>31-10-2015 00:00:00</td>
                        <td>31-10-2015 00:00:00</td>
                        <td>4800,00</td>
                        <td>6000,00</td>
                        <td>1200,00</td>
                        <td>25,00 %</td>
                        <td>1</td>
                        <td>6,00</td>
                        <td>800,00</td>                            
                        <td class="name?ajax_sent"><input data-val="true" data-val-required="The Sendt field is required." id="Collection_0__Sent" name="Collection[0].Sent" type="checkbox" value="true" /><input name="Collection[0].Sent" type="hidden" value="false" /></td>
                        <td class="name?ajax_payed"><input data-val="true" data-val-required="The Betalt field is required." id="Collection_0__Payed" name="Collection[0].Payed" type="checkbox" value="true" /><input name="Collection[0].Payed" type="hidden" value="false" /></td>
                    </tr>
                    <tr>
                        <td class="name?ajax_invoice_id">36</td>
                        <td>25-10-2015 18:54:35</td>
                        <td>25-10-2015 00:00:00</td>
                        <td>25-10-2015 00:00:00</td>
                        <td>6400,00</td>
                        <td>8000,00</td>
                        <td>1600,00</td>
                        <td>25,00 %</td>
                        <td>1</td>
                        <td>8,00</td>
                        <td>800,00</td>                            
                        <td class="name?ajax_sent"><input data-val="true" data-val-required="The Sendt field is required." id="Collection_1__Sent" name="Collection[1].Sent" type="checkbox" value="true" /><input name="Collection[1].Sent" type="hidden" value="false" /></td>
                        <td class="name?ajax_payed"><input data-val="true" data-val-required="The Betalt field is required." id="Collection_1__Payed" name="Collection[1].Payed" type="checkbox" value="true" /><input name="Collection[1].Payed" type="hidden" value="false" /></td>
                    </tr>
        </tbody>

3 个答案:

答案 0 :(得分:1)

要解释您的实际问题,$(this).parent().siblings()只会将其兄弟姐妹返回到该集合,而不会返回包含您点击的td的{​​{1}}。

您可以使用包含兄弟姐妹+本身的checkbox: -

&#13;
&#13;
.addBack()
&#13;
$(document).ready(function() {
  $('#invoice_list :checkbox').on('change', function() {
    var _invoice_id;
    var _payed;
    var _sent;
    $(this).parent().siblings().addBack().each(function() {
      if ($(this).hasClass('name?ajax_invoice_id')) {
        _invoice_id = $(this).text();
      }
      if ($(this).hasClass('name?ajax_payed')) {
        _payed = $(this).children(':checkbox').prop('checked');
      }
      if ($(this).hasClass('name?ajax_sent')) {
        _sent = $(this).children(':checkbox').prop('checked');
      }
    });
    alert('invoice_id: ' + _invoice_id + '\r\npayed: ' + _payed + '\r\nsent: ' + _sent);
  });
});
&#13;
&#13;
&#13;

答案 1 :(得分:0)

检查下面的解决方案将解决您的问题,并确保兄弟姐妹的课程符合您的期望

private void connectToServer() {
    executeCmdCommand("cd C:/PSTools");// navigate to psTools directory
    executeCmdCommand("PsExec.exe //<server1> -u orgnization/user_qa -p      sdsad1212 cmd");// connect the server machine
    executeCmdCommand("powershell.exe C:/powerShell/stop-process.ps1 MainRls");// stopr service by execute powershell script
}

/**
* execute cmd commands
*/
private void executeCmdCommand(String command){
    try {
        ProcessBuilder builder = new ProcessBuilder("cmd.exe", "/c", command);
        Process process = builder.start();
        BufferedReader inputStream = new BufferedReader(new InputStreamReader(process.getInputStream()));
        Report.assertOnReport(inputStream.readLine());
    } catch (IOException e) {
        e.printStackTrace();
    }
}

答案 2 :(得分:0)

<强>更新

$('table input[type=checkbox]').on('change', function() {
  var _invoice_id = 'not found',
    _payed = 'not found',
    _sent = 'not found',
    $this = $(this);

  $this.closest('tr').children('td').each(function() {
    var $this = $(this);

    if ($this.hasClass('name?ajax_invoice_id')) {
      _invoice_id = $(this).text();
    }
    if ($this.hasClass('name?ajax_payed')) {
      _payed = $(this).children('input[type=checkbox]').prop('checked');
    }
    if ($this.hasClass('name?ajax_sent')) {
      _sent = $(this).children('input[type=checkbox]').prop('checked');
    }
  });

  alert('invoice_id: ' + _invoice_id + '\r\npayed: ' + _payed + '\r\nsent: ' + _sent);
});

jsfiddle