使用val(value)设置文本框的值无效

Set value of text box using val(value) doesnt work

本文关键字:无效 置文本 val value 使用      更新时间:2023-09-26

我有一个表,如果点击一行的复选框,该行将被禁用(意味着所有输入都被禁用,文本框的值设置为0(

HTML

@for (int i = 0; i < 3; i++) { 
    tableID = "tableID" + i;
    buttonAddID = "buttonAddID" + i;
    <table id="@tableID"  class="tableSum">
        <tbody>
           <tr>
               <td>Apple</td>
               <td>5</td>
               <td>100</td>
               <td><input type="checkbox" onclick="highLightRow(this)" /></td>
           </tr>
            <tr>
               <td><input type="text" value="Organe" /></td>
               <td>5</td>
               <td>200</td>
               <td><input type="checkbox" onclick="highLightRow(this)" /></td>
           </tr>
        </tbody>
        <tfoot>
            <tr>
               <td>Total</td>
               <td></td>
               <td></td>
               <td></td>
           </tr>
             <tr><td colspan="4"><input type="button" class="addRow" onclick="addRow(this)" value="ADD ROW" id="@buttonAddID"/></td></tr>
        </tfoot>
    </table>
}

在JS中:

function highLightRow(cb) {
    var tr = $(cb).closest('tr');
    var inputs = tr.find('input[type=text]');
    if (cb.checked) {
        tr.removeClass('trNormal')
        tr.addClass('trHighLight');
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].disabled = true;
            inputs[i].val('0');
        }
    }
    else {
        tr.removeClass('trHighLight')
        tr.addClass('trNormal');
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].disabled = false;
        }
    }
}

方法inputs[i].disabled = true;起作用,文本框被禁用,但值未设置为0。

您需要像一样将DOMElement转换为jQuery对象

$(inputs[i]).val('0');

因为DOMElement没有.val方法,或者您可以使用DOMElement中的.value属性,就像一样

inputs[i].value = '0';

.disabled之所以有效,是因为这是DOMElement属性

对于该行,使用eq((而不是[]

inputs.eq(i).val('0');

所发生的事情是访问像inputs[i]这样的项会给本机JavaScriptDOM元素提供val()方法。但是eq()将检索jQuery对象。因此,要么使用上面的,要么采用纯javascript替代

inputs[i].value = '0';

使用jquery每个函数:

inputs.each(function(){
    $(this).val('0');
});

您可以使用eq和prop:

for (var i = 0; i < inputs.length; i++) {
            inputs.eq(i).prop('disabled',true);
            inputs.eq(i).val('0');
        }

您正试图在javaScript DOM对象上调用val()函数,val()不是javaScript Native方法,它只能与jQuery对象一起使用,因此只能使用jQuery选择器进行调用

$(inputs[i]).val('0');

也可以在value变量中赋值

inputs[i].value = '0';