将输入值属性设置为带空格的变量。

Question

I am trying to set the value of a input button to a string variable.ie"A Guide to the School Bus"; But when the HTML loads up only the first word comes up in the button. My code is given below. Thanks for the help.

var title="A Guide to the School Bus";
var htmlString= "<div class="+title+ ">"+"<input type="+"button  "+"value="+title+"  onclick=loadBook()>"+"</div>";
$(htmlString).appendTo(attachPoint);

And the attachpoint is a reference in the HTML that i got using the following.

var attachpoint=document.querySelector('.buttonAttachPoint');

Answer 1

The problem is because you're not putting quotes around the attribute values. Try this:

var htmlString= '<div class="'+title+'"><input type="button" value="'+title+'"  onclick="loadBook()"></div>';

You can either escape all the " in your string or, like I have done, just switch between ' and " . " will show up as a normal character and ' is used to mark the start and finish of strings.

As a side point you probably wouldn't want to put the variable title as the class on the div as it would add each separate word as a class, so in your example the div would have 6 classes added to it.