将动态标签赋予单选按钮 [英] Giving Dynamic label to a radio button

问题描述

我试图创建一个动态表单，然后点击一个按钮，我称之为Javascript函数。这里是函数：

I am trying to create a dynamic form so on click of a button I call a Javascript function. here is the function:

function addradiobutton(type){
    var element = document.createElement("input");
    //Assign different attributes to the element.
    element.setAttribute("type", type);
    element.setAttribute("value", type);
    element.setAttribute("name", type);   

    var foo = document.getElementById("fooBar");
    //Append the element in page (in span).
    foo.appendChild(element);
    counter=counter+1;
 }

这段代码增加了一个单选按钮，它的标签就像这样：

This code adds a radio button and its tag is like this

<input type="radio" name="radio" value="radio">

但是我想要这样的代码。

But I want to make this code like this.

 <input type="radio" name="radio" value="radio">WATER</input>

我不介意关闭输入标记，但我想最后得到'Water'值的代码。
水资源只是一个例子，它的价值也是动态的。
我该怎么做？

I dont mind about closing input tag but I want to get the value 'Water' their at the end of the code.
Water is just taken for example its value would be dynamic as well.
What should I do ?

推荐答案

试试这个

Try this

<script type="text/javascript">
        var counter = 0;
        function addradiobutton(type, text) {
            var label = document.createElement("label");

            var element = document.createElement("input");
            //Assign different attributes to the element.
            element.setAttribute("type", type);
            element.setAttribute("value", type);
            element.setAttribute("name", type);

            label.appendChild(element);
            label.innerHTML += text;

            var foo = document.getElementById("fooBar");
            //Append the element in page (in span).
            foo.appendChild(label);
            counter = counter + 1;
        }
        addradiobutton("radio", "Water");
</script>

这篇关于将动态标签赋予单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！