0

我正在创建一个测试表格。我创建了一个包含要测试的步骤列表的表单。

而不是列表中的每个项目都需要：

<input type="radio" name="step1">Pass<input type="radio" name="step1">Fail

我想创建一个函数，所以我每次都可以调用它来创建它。到目前为止，这是我的功能：

function createPassFail(name)
{
    var Pass = document.createElement('input');
    Pass.type = "radio";
    Pass.name = name;
    document.getElementById("Pass").innerHTML = "Pass";

    var Fail = document.createElement('input');
    Fail.type = "radio";
    Fail.name = name;
    document.getElementById("Fail").innerHTML = "Fail";
}

然后我称之为：

<li>Step One: Turn the TV On
<input id = "step1" onload="createPassFail(this.value)">
</li>

所有这一切都是创建一个文本框，这不是我想要的。我也不确定 onload 是否正确。

4

1 回答 1

1

而不是传递value给函数，你应该传递 id：

onload="createPassFail(this.id)"
//                          ^^

我说你的事件应该是onblur因为我不认为onload你应该使用事件处理程序。您可以使用我的建议，或者在文本框旁边设置一个按钮，当单击（使用onclick）时，它会执行您想要的操作。

此外，您还没有在 HTML 中插入通过或失败元素。尝试这个：

document.body.appendChild(Pass);
document.body.appendChild(Fail);

这会将新创建的元素直接插入到 body 元素的末尾。如果您希望它们成为其中某个元素的子元素，则必须使用合适的方法访问该元素。例如，使用getElementById：

document.getElementById( element ).appendChild(Pass); // do the same for Fail

然而，这一切都可以通过 jQuery 轻松完成。

$(document).ready(function() {
    function createPassFail(name)
    {
        $('body').append('<input type="radio" id="' + name + '">Pass');
        $('body').append('<input type="radio" id="' + name + '">Fail');
    }

    $('#step1').ready(function() {
        createPassFail(this.id);
    });
});

现场演示

于 2013-03-26T15:14:03.057 回答