如何使用jquery在只读文本输入中显示值

时间:2012-12-02 01:59:13

标签: jquery html

以下是我在应用程序中显示的表的示例:

Marks Per Answer               Total Marks    Marks Remaining

(blank text input)              
(blank text input)               6              6           

(blank readonly text input)      4              0

我遇到的问题是,发生的事情是表中的任何只读文本输入应显示与“Total Marks”列下的数字相同的值。所以表格如下所示:

Marks Per Answer                   Total Marks    Marks Remaining

(blank text input)                    
(blank text input)                    6              6

(readonly text input value='4')       4              0

我的问题是,为了在只读文本输入中显示正确的值,我需要在下面的代码中进行哪些更改?

if ($("[class*=q" + i + "_mark]").length == 1) {
    //alert(t_marks);
    var t_marks = $("[class*=q" + i + "_ans]");
    var t_marksHtml = t_marks.html();
    t_marks.html("0");
    $("[class*=q" + i + "_mark]").val(t_marksHtml).attr('readonly', true);
    //$("[class*=q"+i+"_mark]").attr('readonly',true);
}

以下是HTML:

<table border='1' id='markstbl'>
<thead>
<tr>
<th class='answermarksth'>Marks per Answer</th>
<th class='totalmarksth'>Total Marks</th>
<th class='noofmarksth'>Marks Remaining</th>
</tr>
</thead>
<tbody>

<tr class="questiontd">
<td class="answermarkstd">
<input class="individualMarks q1_mark_0"  q_group="1" name="answerMarks[]" id="individualtext" type="text" />
</td>
<td class="totalmarkstd" rowspan="2">6</td>
<td class="noofmarkstd q1_ans_text"  q_group="1" rowspan="2"><strong>5</strong></td>
</tr>

<tr class="questiontd">
    <td class="answertd" name="answers[]">D</td>
<td class="answermarkstd">
<input class="individualMarks q1_mark_0"  q_group="1" name="answerMarks[]" id="individualtext" type="text" />
</td>
</tr>

<tr class="questiontd">
<td class="answermarkstd">
<input class="individualMarks q2_mark_0"  q_group="1" name="answerMarks[]" id="individualtext" type="text" />
</td>
<td class="totalmarkstd" rowspan="1">6</td>
<td class="noofmarkstd q2_ans_text"  q_group="1" rowspan="1"><strong>5</strong></td>
</tr>
</tbody>
</table>

1 个答案:

答案 0 :(得分:1)

似乎你需要这样的东西,因为表格的丑陋标记(有跨度)很难选择适当数量的遗留标记,所以这里有一个允许-1的错误,所有其他工作正常,

您需要检查您的标记,因为输入和保留标记之间的关系是不清洁的。

sample

$('.individualMarks').change(function() {
    t = $(this);
    console.log(t.parents('tr').get(0));
    var remain_e = t.parents('tr').children('.noofmarkstd').last().children();
    console.log(remain_e.get(0));
    if (remain_e.length < 1) {
        var c = 2;
        var m = $(this);
        while (remain_e.length < 1 && c < 100) {

            remain_e = m.parents('tr').prev().children('.noofmarkstd').last().children();
            m = m.parents('tr').prev();
            c++;
        }
        if (c >= 100) {
            console.error('error finding element!');
            return;
        }
    }
    remain = remain_e.html();
    remain--;
    if (remain <= 0) {
        t.attr('readonly', "true"), remain_e.parents('tr').find('input').attr('readonly', "true")
    };
    remain_e.html(remain);
});​