Javascript不能把它列出来

Javascript can't make it listed

本文关键字：不能 Javascript      更新时间：2023-09-26

我有这个函数，打印5个随机文本中的一个在图像上(在我的情况下，是一个记事本，就像在上面写字一样)

function getatext()
{
   var whichtext=get_random();
    var text=new Array(5)
     text[0]="text0";
     text[1]="text1";
     text[2]="text2";   
     text[3]="text3";
     text[4]="text4";
     document.getElementById("notepad").innerHTML +=
             '<p class="notepad">'+(text[whichtext])+'</p>';

问题是，每次我打印文本时，它都被打印在另一个文本的顶部，而不是像一个新条目一样，并将其他条目推到列表的下面。

我尝试了<li>标签，但大多数例子和tuts我可以偶然发现在简单的html页面中使用它们，而不是在javascript文本中编写，这似乎有点困难(至少对我来说)。

使用'<p class="notepad">'+'<li>'+(text[whichtext])+'</li>'+'</p>';让我的列表出现，虽然它不是打印在图像上，但方式。我猜它完全忽略了<p>标签这种方式?

我甚至尝试在我的。css中创建一个ul.notepad，以防它重要…我做错了什么?

EDIT:包含在。css .notepad, p.notepad和<content>中，所有这些都发生了:

#content {
    border-left:1px solid #000;
    border-right:1px solid #000;
    background:#ffffff;
    margin-left: 24.9%;
    width:75%;
    min-height:0;
    position:relative;  
.notepad {
        position: relative;
        background-repeat:no-repeat;  
        background-attachment:fixed; 
        width: 300px;
}
p.notepad {
    font-family:"Lucida Handwriting";
    position: absolute;
    top: 90px; 
    left: 65px;   
}

编辑2:检查问题一些更多后，我发现position: absolute;在我的p.c nopad可能是导致这一切。第一次打印随机文本，然后当要打印第二个文本的时间到来时，它从p.notepad中获取相同的坐标，这就是为什么它将其打印在第一个文本的顶部。但是位置:绝对是很重要的，否则文本它不会打印在我的记事本图像..

这可能是CSS问题，而不是HTML问题。HTML的格式可能是重叠的。没有看到CSS是很难的。

下面是一个你正在做的事情的例子:

http://jsbin.com/abemiv

使用:http://jsbin.com/abemiv/edit

编辑源

我的第一个猜测是你在记事本类上有绝对定位。

试试这个CSS: 

.notepad {
    position:relative;
}

不需要ul/li方法，您拥有的<p> </p>就足够了。我同意可能的罪魁祸首是css -你能张贴你的css吗?

相关文章：