禁用ID属性以其开头的所有按钮

时间:2015-07-09 10:29:22

标签: javascript

我有一张表格,上面有一张桌子。该表列出了多行,每行都有一个“创建”按钮。表本身使用for循环,并将行值附加到按钮ID的末尾,如下所示

<button type="button" class="btn btn-default" id="create_<%: stck.Stock%>" onclick="SetupDisinvestmentsFields(this,'<%=stck.SEDOL%>','<%=stck.Quantity%>','<%=stck.value%>')">
     <span class="glyphicon glyphicon-plus"></span> Create
</button>

我的完整代码是

<table class="table table-striped">
    <tr>
        <th>Stock</th>
        <th>SEDOL</th>
        <th>Quantity</th>
        <th>Value</th>
        <th>Actions</th>
    </tr>
     <%
        foreach (var stck in stocks)
        { %>
            <tr>
                <td><%: stck.Stock%></td>
                <td><%: stck.SEDOL%></td>
                <td><%: stck.Quantity%></td>
                <td><%: String.Format("{0:c}", stck.value)%></td>
                <td>
                    <button type="button" class="btn btn-default" id="create_<%: stck.Stock%>" onclick="SetupDisinvestmentsFields(this,'<%=stck.SEDOL%>','<%=stck.Quantity%>','<%=stck.value%>')">
                        <span class="glyphicon glyphicon-plus"></span> Create
                    </button>
                </td>
            </tr>
        <% }
    %>
</table>

我想要的是当页面状态发生变化时,表格中的所有“创建”按钮都会被禁用。

我尝试过以下操作,但它只会禁用第一个按钮而不是其余按钮

document.querySelector('[id^="create_"]').disabled = true;

1 个答案:

答案 0 :(得分:3)

document.querySelector仅返回第一个匹配的元素。您需要改为使用document.querySelectorAll,然后循环遍历生成的NodeList:

var elems = document.querySelectorAll('[id^="create_"]');

for (var i = 0; i < elems.length; i++) {
    elems[i].disabled = true;
}