子弹不显示<ul>

Question

项目符号未显示.当我通过jsFiddle尝试相同时,它的工作原理.可能是什么原因？

         <div id="mainInfo" style="display: none;" title="Customer Information">
            <div id="greenCheck" style="display: none;">
                <img src= "IMAGE_SOURCE">
            </div>
            <div id="subInfo" style="display: none;">
            </div> 
         </div>
         <div>
            //button definition onclick="show()"![enter image description here][1]
         </div>

//javascript
function show() 
{
    var htmlstr = "<p><b>The customer provided the following:</b></p><br/><ul>";
    if(true)//some condition which i made true for testing
        {
             htmlstr = htmlstr + "<li>Date of Birth</li>";
             htmlstr = htmlstr + "<li>Social Security Number</li>";
        }
        htmlstr = htmlstr + "</ul>";
        document.getElementById('mainInfo').style.display = 'block';
        document.getElementById('greenCheck').style.display = 'block';
        document.getElementById('subInfo').style.display = 'block';
        jQuery("#subInfo").html(htmlstr);
        jQuery("#mainInfo").dialog({
              //dialog code
        }
}

list-style-type:none通过css文件应用.我修改了本地文件,它工作:)

Answer 1

您可以添加此CSS以确保仅在要动态添加的列表中获得项目符号:

#subInfo ul li {
  list-style-type: disc;
}

以下是您的选择:

形式语法:disc | 圈子| 广场| 小数| decimal-leading-zero | 低罗马| 上罗马| 低希腊| 低拉丁语| 上拉丁语| 亚美尼亚人| 格鲁吉亚| 低α| upper-alpha | 没有

资料来源:https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type

至于你的更新问题,有很多不同的方法可以使用,从将图像和项目符号列表放入表格(我认为是一个坏主意),到使用包含DIVs.不过,如果你并不想改变HTML(和JavaScript),那么也许加入padding-left到li在CSS推列表项出现与文本排队.这是一种破解,但它很容易推理,并且不需要对HTML进行任何更改.