Enable/Disable 使用动态添加的复选框的按钮

Question

我正在制作一个简单的待办事项列表。目前我有三个按钮（enterBtn、completeBtn、deleteBtn）——在启动时都被禁用。第一个 EnterBtn，在使用 jquery（工作正常）完成表单时启用。然后，当我提交表单时，javascript 创建一个包含跨度和复选框的 < ul >（也可以正常工作）。现在，我想启用 completeBtn if/when 选中任何新的复选框项目。有人可以帮我弄清楚如何切换我的完成按钮吗？最终是使用 completeBtn 在单击任何复选框时都启用，然后我计划只删除选中的那些，但我会自己完成那部分。我需要的唯一帮助是根据下面的代码找出解决此问题的最佳方法。

我会//在我目前测试过的地方发表评论。

HTML

<input type="text" id="goalId">
<input id="completeBtn" value="Complete" type="button"   disabled="disabled"/>
<ul id="log_data"></ul>

JavaScript

function disableFunction() {
document.getElementById("enterBtn").disabled = 'true';
}
function enableFunction(cbId) {
//tested here
}
function checkSpanStatus() {
alert("path works");
} 
function updateItemStatus() {
var cbId = this.Id.replace("cb_","");
var itemText = document.getElementById("item_" + cbId);
if(this.checked) {
itemText.style.textDecoration = "line-through";
//document.getElementById("completeBtn").disabled = 'false'; <tried this>
enableFunction(); //and this
}else{
itemText.style.textDecoration = "none";
}
}

function addNewItem(list, itemText) {
totalItems++;

var listItem = document.createElement("ul");


var checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.Id =  "cb_" + totalItems;
checkbox.onclick = updateItemStatus;

var span = document.createElement("span");
span.id = "item_" + totalItems;
span.onclick = checkSpanStatus;
span.innerText = itemText;
listItem.appendChild(span);
listItem.appendChild(checkbox);
list.appendChild(listItem);
}
var totalItems = 0;
var inItemText = document.getElementById("goalId");
var form = document.getElementById("goalForm");
function btn1() {{
var itemText = inItemText.value;
if (!itemText || itemText == " ") {
return false
};
addNewItem(document.getElementById("log_data"), itemText);
form.reset();
disableFunction();
}
};

Answer 1

你不能禁用按钮的原因是你应该使用 boolean 而不是 string:

your_button.disabled = true;
your_button.disabled = false;

JSFiddle（使用您的脚本）

Enable/Disable 使用动态添加的复选框的按钮

Enable/Disable button using dynamically added checkbox's

html

javascript

checkbox

jquery