留言板
append not working in javascript
<form id="fm"></form>
<script>
var previewURL = '<%=urls%>';
previewURL = previewURL.split(', ');
for (i = 0; i < previewURL.length; i++) {
var query ='<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url('+previewURL+')no-repeat;background-size:100% 100%;"></div>';
document.getElementById("fm").append(query);
}
</script>
The query appended like as text inside form
After Inspect that element it would like this
<form id="fm"></form>
"<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url(http://localhost:8080/documents/20181/22221/Image-red.jpg/c77ac788-11be-46d0-a109-6aa5f7cdb4c3?version=1.0&t=1493119792000&imagePreview=1)no-repeat;background-size:100% 100%;"></div>"
So the functionality not works
<script>
var previewURL = '<%=urls%>';
previewURL = previewURL.split(', ');
for (i = 0; i < previewURL.length; i++) {
var query ='<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url('+previewURL+')no-repeat;background-size:100% 100%;"></div>';
document.getElementById("fm").append(query);
}
</script>
The query appended like as text inside form
After Inspect that element it would like this
<form id="fm"></form>
"<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url(http://localhost:8080/documents/20181/22221/Image-red.jpg/c77ac788-11be-46d0-a109-6aa5f7cdb4c3?version=1.0&t=1493119792000&imagePreview=1)no-repeat;background-size:100% 100%;"></div>"
So the functionality not works
David H Nebinger,修改在6 年前。
RE: append not working in javascript
Liferay Legend 帖子: 14919 加入日期: 06-9-2 最近的帖子Madasamy P:
document.getElementById("fm").append(query);
The query appended like as text inside form
After Inspect that element it would like this
<form id="fm"></form>
"<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url(http://localhost:8080/documents/20181/22221/Image-red.jpg/c77ac788-11be-46d0-a109-6aa5f7cdb4c3?version=1.0&t=1493119792000&imagePreview=1)no-repeat;background-size:100% 100%;"></div>"
This is not a Liferay problem, this is merely a lack of understanding of basic javascript. I think there are javascript newbie forums that may help you learn the ins and outs of javascript. The w3schools site does a good job at sharing basic JS functionality.
Come meet me at the 2017 LSNA!
David H Nebinger:
Madasamy P:document.getElementById("fm").append(query);
The query appended like as text inside form
After Inspect that element it would like this
<form id="fm"></form>
"<div style="height: 250px;width: 250px;border:1px solid #ff8533;background: url(http://localhost:8080/documents/20181/22221/Image-red.jpg/c77ac788-11be-46d0-a109-6aa5f7cdb4c3?version=1.0&t=1493119792000&imagePreview=1)no-repeat;background-size:100% 100%;"></div>"
This is not a Liferay problem, this is merely a lack of understanding of basic javascript. I think there are javascript newbie forums that may help you learn the ins and outs of javascript. The w3schools site does a good job at sharing basic JS functionality.
Come meet me at the 2017 LSNA!
Thank you David I found the solution already in w3schools site
var div = document.createElement("div");
div.style.width = "250px";
div.style.height = "250px";
div.style.background = "red";
div.style.border = "1px solid #ff8533";
div.style.background = 'url('+previewURL+') no-repeat';
div.style.backgroundSize = "100% 100%";
document.getElementById("fm").appendChild(div);
It works