<!doctype html> <html> <head> <script type="text/javascript"> var =1; function addkid(){ if(i<=3){ i++; var div=document.createelement('div'); div.innerhtml="child:<input type="text" name="child_1"> <input type="button" id="add_kid()" onclick="addkid()" value="+" /> <input type="button" value="-" onclick="removekid(this)">"; document.getelementbyid('kids').appendchild(div); } } function removekid(div){ document.getelementbyid('kids'.removechild(div.parentnode); i--; } </script> </head> <body> <form> name: <input type="text" name="name"><br/> <div id="kids"> child:<input type="text" name="child_1"> <input type="button" id="add_kid()" onclick="addkid()" value="+" />(limit 3) </div> phone: <input type="text" name="phone"><br/> <input type="submit" name="submit" value="submit" /> </form> </body> </html> this html code has javascript function add text box dynamically when '+' button clicked, program not work giving error:
(check5.php?name=&child_1=&phone=:10 uncaught syntaxerror: unexpected identifier)` in javascript function part 1.
please me solve this
the problem string literal in assignment:
div.innerhtml="child:<input type="text" name="child_1"> <input type="button" id="add_kid()" onclick="addkid()" value="+" /> <input type="button" value="-" onclick="removekid(this)">"; when string declared " characters have use backslashes escape " characters needed in string itself. also, can't have line breaks in middle of string literal (unless es6 string declared back-ticks instead of quotation marks).
so try this, escaping , no carriage returns:
div.innerhtml = "child:<input type=\"text\" name=\"child_1\">" + " <input type=\"button\" id=\"add_kid()\" onclick=\"addkid()\" value=\"+\" />" + " <input type=\"button\" value=\"-\" onclick=\"removekid(this)\">"; or can surround string single quotes , don't have escape double quotes:
div.innerhtml = 'child:<input type="text" name="child_1">' + ' <input type="button" id="add_kid()" onclick="addkid()" value="+" />' + ' <input type="button" value="-" onclick="removekid(this)">'; either way have removed line breaks in string concatenating 3 string literals can still formatted 3 lines in code. instead make 1 long line:
div.innerhtml = 'child:<input type="text" name="child_1"> <input type="button" id="add_kid()" onclick="addkid()" value="+" /> <input type="button" value="-" onclick="removekid(this)">'; if need actual newline character in string use \n, "this string has newline here:\nthank you."
update: missing ) after 'kids' on line:
document.getelementbyid('kids'.removechild(div.parentnode); expand following code snippet see above things fixed, , code working:
var = 1; function addkid() { if (i <= 3) { i++; var div = document.createelement('div'); div.innerhtml = 'child:<input type="text" name="child_1">' + ' <input type="button" id="add_kid()" onclick="addkid()" value="+" />' + ' <input type="button" value="-" onclick="removekid(this)">'; document.getelementbyid('kids').appendchild(div); } } function removekid(div) { document.getelementbyid('kids').removechild(div.parentnode); i--; }<form> name: <input type="text" name="name"> <br/> <div id="kids"> child: <input type="text" name="child_1"> <input type="button" id="add_kid()" onclick="addkid()" value="+" />(limit 3) </div> phone: <input type="text" name="phone"> <br/> <input type="submit" name="submit" value="submit" /> </form>
Comments
Post a Comment