Question

我正在尝试为模拟帐户禁用“标签式菜单”页面的“提交”按钮。不幸的是，3个菜单选项卡中的每一个都具有相同的按钮ID - 'Mod0EditRecord'。我无法重命名按钮ID，也不能使用类，因为它是由在线数据库呈现的。

<input type="submit" value="Update" name="Mod0EditRecord" id="Mod0EditRecord">
<input type="submit" value="Update" name="Mod0EditRecord" id="Mod0EditRecord">
<input type="submit" value="Update" name="Mod0EditRecord" id="Mod0EditRecord">

我可以成功将第一个按钮的属性设置为禁用，如下所示

if (login == 'demo.account')
{
document.getElementById('Mod0EditRecord').setAttribute("disabled","disabled");
document.write("<br><p style=\"text-align:left; padding-left:100px; font-size:10px;\">** Update button is disabled for the demo **</p>");
} 
else
{
document.getElementById('Mod0EditRecord').removeAttribute("disabled");
}

我正在寻找有关如何为其他两个设置属性的指导。

提前致谢

Answer 1

您可以使用像jQuery这样的javascript dom操作库来遍历HTML节点，并根据需要添加类/更改ID。

如果你必须特别坚持这些属性，那么你可以在jQuery中做这样的事情：

$('input[name="Mod0EditRecord"]').eq(0).attr('disabled','disabled') 
//this is the first input, change .eq(index) to the value you need

Answer 2

document.getElementById的返回值应该是一个数组。你可以遍历它们。

var elem = document.getElementById('Mod0EditRecord');
    for(var i = 0; i < elem.length; i++)
    {
      elem[i].setAttribute("disabled","disabled");
    }

或者如果您使用的是jquery，则可以使用.next（）方法来检索其他两个元素。

Answer 3

您无法使用document.getElementById，因为它会返回具有该ID的第一个元素。如果你使用的是VanillaJS，我不会使用jQuery，因为为这个功能下载一个库是没用的。

这就是您要做的：使用document.getElementsByTagName获取所有input类型，检查它是来自type submit还是disable。

var inputs = document.getElementsByTagName('input');
for(var i = 0; i < inputs.length; i++ ) {
    if(inputs[i].type === "submit") {
        var submitbtn = inputs[i];
        submitbtn.setAttribute("disabled", "disabled");
    }
}

JSFiddle

禁用提交按钮进行演示

3 个答案: