我需要创建一个可点击的图像,上面动态获取文本。 我已经有了获取文本所需信息的 php,但我在创建按钮时遇到了问题(我对这类东西真的很陌生)。 这是我想要创建的示例:
文本“A020310”是一个 php 答案并且一直在变化(保存在“stringaPosizione”中,按钮的值)。将创建可变数量的此图像,单击它们将开始一些操作。
我有一个创建按钮的 javascript 代码,但它们没有图像:
//Create an input type dynamically.
var element = document.createElement("input");
//Assign different attributes to the element.
element.setAttribute("type", "button");
element.setAttribute("class", "mybutt");
element.setAttribute("value", stringaPosizione);
element.setAttribute("name", idMappatura);
element.onclick = function() { runCommand(this) };
CSS:
.mybutt {
background-image: url(/box.png);
-moz-box-shadow:inset 0px -1px 20px 1px #ffffff;
-webkit-box-shadow:inset 0px -1px 20px 1px #ffffff;
box-shadow:inset 0px -1px 20px 1px #ffffff;
background-color:transparent;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border:5px solid #dcdcdc;
display:inline-block;
color:#777777;
font-family:arial;
font-size:20px;
font-weight:bold;
padding:10px 40px;
text-decoration:none;
text-shadow:1px 3px 4px #ffffff;
}
.mybutt:active {
position:relative;
top:1px;
}
你有什么建议吗?
最佳答案
您是否将元素
附加到任何对象上?如果没有,您只是在浏览器内存中创建一个元素,而不是将其附加到 dom 树。
此外,您必须设置按钮的尺寸以显示整个图像。
看this fiddle并告诉我是否缺少任何东西。
关于php - 动态创建带有悬停文本的 "button"图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17022949/