Sar*_*ara 1 javascript checkbox jquery
我正在尝试用 JS 创建一个待办事项列表。这个想法是在输入中写一些东西,当用户单击按钮时,他会获得一个带有文本的复选框。
\n\n问题是我不知道如何用 JS 做到这一点。我尝试将“li”更改为输入,然后设置属性(“type”,“checkbox”),但没有任何反应。
\n\n<!DOCTYPE html>\n<html>\n<head>\n <title>Lista de tareas personal.</title>\n <meta charset=\'utf-8\'>\n <style type="text/css">\n body{\n font-family: Helvetica, Arial;\n }\n li{\n width: 50%;\n list-style-type: none;\n font-size: 20px;\n }\n </style>\n</head>\n<body>\n <h1>Lista de tareas personal.</h1>\n <hr>\n <br>\n <button type="button" id="btn" onclick="a\xc3\xb1adirItems">A\xc3\xb1adir Item</button>\n <input type="text" id="texto">\n\n <!---<ul id="lista"> </ul>-->\n <ul id="ul"> </ul>\n\n <script type="text/javascript">\n function addItem(){\n var ul = document.getElementById(\'ul\'); //ul\n var li = document.createElement(\'li\');//li\n var text = document.getElementById(\'texto\');\n li.appendChild(document.createTextNode(text.value));\n ul.appendChild(li); \n }\n var button = document.getElementById(\'btn\');\n button.onclick = addItem \n </script>\n</body>\n</html>\nRun Code Online (Sandbox Code Playgroud)\n\n有什么建议么?
\n您似乎没有使用 jquery,因此 jquery 标签不会为您提供有用的答案。您可以按照创建 li 元素的相同方式创建复选框。
function addItem(){
var ul = document.getElementById('ul'); //ul
var li = document.createElement('li');//li
var checkbox = document.createElement('input');
checkbox.type = "checkbox";
checkbox.value = 1;
checkbox.name = "todo[]";
li.appendChild(checkbox);
var text = document.getElementById('texto');
li.appendChild(document.createTextNode(text.value));
ul.appendChild(li);
}
var button = document.getElementById('btn');
button.onclick = addItem;
Run Code Online (Sandbox Code Playgroud)
http://jsfiddle.net/u7f5rwjs/1/