如何在更改节点 JS 表中的复选框时禁用按钮

How to disable a button when changing the checkboxes in a table in Node JS?

本文关键字:复选框 按钮 JS 节点      更新时间:2023-09-26

我有一个表格,里面有一些图像和复选框。我试图在更改表格中的任何复选框时启用提交按钮。我的表格如下所示,

<form action="/slideShowPage" method="GET">
    <table id="imgTable" class="table">
        {{#images}}
             <tr>
                 <td><a href="/deleteImage?imageID={{imgURL}}" class="btn btn-danger" title="Clear All">Remove</a><label value={{imgURL}}>{{imgURL}}</label></td>
                 <td><img src={{imgURL}} style="width:100px;height:100px"></td>
                 <td><input id={{imgURL}} type="checkbox" name="image" value={{imgURL}}/><br></td>
             </tr>
         {{/images}}
     </table>
     <br>
     {{#msg}}
         <div class="alert alert-info">{{msg}}</div>
     {{/msg}}
     <a href="/" class="btn btn-success pull-right" title="Add More">Add more</a>
     <input type="submit" value="Create Slide Show" class="btn btn-success pull-left" disabled/>
</form>

我尝试使用下面的javascript启用该按钮,

<script type="text/javascript">
    var checkboxes = $("input[type='checkbox']"),
            submitButt = $("input[type='submit']");
    checkboxes.click(function () {
        submitButt.attr("disabled", !checkboxes.is(":checked"));
    });
</script>

我从JSFiddle得到了这个JavaScript。但它不起作用。我也在使用 NodeJS,我的 jquery 版本是 jquery-2.0.3 .谁能帮我解决这个问题?

提前感谢!

将元素的禁用属性设置为 false

提交屁股禁用 = 假;如果你使用的是jQuery,等效的将是:

$("input[type='submit']").prop('disabled', false);

或为输入元素提供 id 或类,例如"inputDisabled"。 $('.inputDisabled').removeAttr("disabled");

我找到了解决方案。

<script type="text/javascript">
    $( document ).ready(function() {
        console.log("Cheeeee 1");
        var checkboxes = $("input[type='checkbox']"),
                submitButt = $("input[type='submit']");
        checkboxes.change(function() {
            console.log("Cheeeee");
            submitButt.attr("disabled", !checkboxes.is(":checked"));
        });
    });
</script>

因为在文档"准备就绪"之前无法安全地操作页面。 jQuery 会为您检测这种就绪状态。$( document ).ready()中包含的代码仅在页面文档对象模型 (DOM) 准备好执行 JavaScript 代码时运行。

试试这个。

绑定到更改事件而不是单击事件。

var checkboxes = $("input[type='checkbox']"),submitButt = $("input[type='submit']");
checkboxes.change(function() {
    submitButt.attr("disabled", !checkboxes.is(":checked"));
});