如何使用Jquery从特定行获取输入文本值

Question

大家好，这是我目前正在建设的页面：

单击“提交”时，我在当前行中获取文本值并通过jquery ajax提交。对我来说没有问题，但是当我在网络中的另一台PC上测试时会出现错误消息（通过json）。像年假和病假这样的事情是不明确的。

我测试的其他电脑中的错误示例：

这是我使用的代码：

function popUpReasonApplyLeave(){
$('a.submit').bind('click', function(e) {
    e.preventDefault();
    //get the tr row id you have clicked
    var trid =  $(this).closest('tr').attr('id');       
    $('#pop_up_apply_leaveReason').show();
    submitReason(trid);
    //when submit call the ajax function here
});

}

ajax函数中的数据

data : {
    idstaff : trid,
    annualleave : $('#'+trid+' input#annualleave').val(),
    sickleave : $('#'+trid+' input#sickleave').val(),
    reason : $('#reason').val(),
}

html表格代码

<?php foreach($list as $value) {?>

    <tr id='staffID_<?php echo $value['IDSTAFFTABLE']; ?>'>
        <td><?php echo $value['FIRSTNAME']; ?> <?php echo $value['LASTNAME']; ?></td>
        <td><?php echo $value['POSITIONNAME']; ?><input type="hidden" id="idstaff" name="idstaff" value="<?php echo $value['IDSTAFFTABLE']; ?>" /></td>
        <td><input type="text" name="annualleave" class="annualleave" value="<?php echo $value['ANNUALLEAVEBALANCE']; ?>" id="annualleave"/></td>
        <td><input type="text" name="sickleave" class="sickleave" value="<?php echo $value['SICKLEAVEBALANCE']; ?>" id="sickleave"/></td>
        <td><a href="#"class="submit">Submit</a></td>            
    </tr>

    <?php } ?>

ajax代码

$.ajax({
beforeSend : function(){ 
$("#submitreason").unbind('click');
},
type: "POST",
async : false,
url: "http://192.168.1.5:83/staging/eleave/application/controller/controller.php?action=doupdateleavecontroller",
dataType: 'json',
data : {
    idstaff : trid,
    annualleave : $('#'+trid+' input#annualleave').val(),
    sickleave : $('#'+trid+' input#sickleave').val(),
    reason : $('#reason').val(),
},
success : function(data) {
    var encoded = $.toJSON(data);             
    var result = $.evalJSON(encoded).msg;
    $('#pop_up_apply_leaveReason').hide();
    alert(result);
    location.reload();

},
error : function(XMLHttpRequest, textStatus, errorThrown) {
    alert(XMLHttpRequest + " : " + textStatus + " : " + errorThrown);
}
}); 

Answer 1

检查id的'annualleave'或'sickleave'是否真的是唯一的。 IE无法处理重复的ID以及Firefox / Chrome。

编辑：这行代码暗示它不是唯一的：

$('#'+trid+' input#annualleave').val()

每个表行都有一个id为anualleave的输入。您只能使用一次id，即使jQuery处理得很好并选择了正确的输入。 IE在这种情况下要严格得多，并忽略了重复的ID。

我建议改用class，结果是：

$('#'+trid+' input.annualleave').val()