简体   繁体   中英

How to insert <input> tag inside <div> tag using javascript?

I am new to javascript. I just want to create a list with textbox and label in a row.

So that I created a ul tag with id cstList.

and called a function listData() on the onclick event

Inside that I am trying to create a input tag inside a div tag .

But i am getting error when trying to run this.

Here is my code:

function listData()
    {       
        //var a = sessionStorage.getItem('id');
        if(sessionStorage == null)
        {
            alert("Session storage not supported here");
        }
        else
        {
            var ss = sessionStorage.getItem('id');
            alert("storage value is: "+ss);
        }
    var rows = prompt('Please type in the number of required rows');
    var listCode = '';

    for (var i = 0; i < rows; i++) {
        var listID = 'list_' + i.toString();
        var divID = 'div_' + i.toString();      
            listCode += '<li id="' + listID + '" onclick="itemClicked(this.id);"><div id = "'+ divID + '"> <input type= 'text' id= 'boltQTY' name= 'boltQTY' value = 'abc' size="5"/> </div></li>';
    }
    document.getElementById('cstList').innerHTML = listCode;
    }

This is the above line where i am getting error: Unexpected Identifier

 listCode += '<li id="' + listID + '" onclick="itemClicked(this.id);"><div id = "'+ divID + '"> <input type= 'text' id= 'boltQTY' name= 'boltQTY' value = 'abc' size="5"/> </div></li>';

You are using single quotes and that is breaking the string.

<input type= 'text' id= 'boltQTY' name= 'boltQTY' value = 'abc' size="5"/>

should be:

<input type= "text" id= "boltQTY" name= "boltQTY" value = "abc" size="5"/>

That has to be double-single-single-double

listCode += "<li id='" + listID + "' onclick='itemClicked(this.id);'><div id = '"+ divID + "'> <input type='text' id='boltQTY' name='boltQTY' value='abc' size='5'/> </div></li>";

variable = "string" + var1 + "string=' " + var2 +"' ";

Simply make sure plus sign (+) is in between double quotes ("")

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM