Question

我附加了一个id为div div的div，并且下一行的目的是将内容附加到此div。它没有选择。怎么回事？

$('body').append("<div id ='backFade' style='background-color: Black; left: 0; top: 0; width: 100%; height: 100%;min-height: 768px; position: absolute; -moz-opacity: 0.7; filter: alpha(opacity=70);opacity: 0.7;'></div>");
    $('body').append("<div id='popup' style='background-color:white;display:block; border: solid 3px #A9D0F5;top: 45%;left:50%; margin-top:-75.5px; margin-left:-203px;width: 500px; height: 200px; z-index: 100; position: fixed;'></div>");
    $('#popup').append("hi");

“嗨”没有出现:(

Answer 1

为什么不在创建后直接附加它？

$('body').append (
    $('<div id="popup"></div>')
        .css ({
            'backgroundColor': 'white',
            'display': 'block',
            'borderr': 'solid 3px #a9d0f5',
            'top': '45%',
            'left': '50%',
            'marginTop': '-75.5px',
            'marginLeft': '-203px',
            'width': '500px',
            'height': '200px',
            'zIndex': '100',
            'position': 'fixed'
        })
        .append("hi")
);

Answer 2

试试这个：

// Create and append div1.
var div1 = $('<div id="div1" />');
$('.some-element').append(div1);

// Append contents.
div1.append('<div id="div2" />');
// Etc.

修改：查看您的代码，我认为您想要的是使用text函数：

$('#popup').text('hi');

修改：好的，试试这段代码片段;它有用吗？

<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
        <script type="text/javascript">
        $(function()
        {
            $('body').append("<div id ='backFade' style='background-color: Black; left: 0; top: 0; width: 100%; height: 100%;min-height: 768px; position: absolute; -moz-opacity: 0.7; filter: alpha(opacity=70);opacity: 0.7;'></div>");
            $('body').append("<div id='popup' style='background-color:white;display:block; border: solid 3px #A9D0F5;top: 45%;left:50%; margin-top:-75.5px; margin-left:-203px;width: 500px; height: 200px; z-index: 100; position: fixed;'></div>");
            $('#popup').append("hi");
        });
        </script>
    </head>
    <body>
    </body>
</html>

Answer 3

$(function(){
    $('body').append("<div id ='backFade' style='background-color: Black; left: 0; top: 0; width: 100%; height: 100%;min-height: 768px; position: absolute; -moz-opacity: 0.7; filter: alpha(opacity=70);opacity: 0.7;'></div>");
        $('body').append("<div id='popup' style='background-color:white;display:block; border: solid 3px #A9D0F5;top: 45%;left:50%; margin-top:-75.5px; margin-left:-203px;width: 500px; height: 200px; z-index: 100; position: fixed;'></div>");
        $('#popup').append("hi");    
});

对我来说很好。在IE浏览器中，我不得不删除margin: -203px以进入视图。

<强> 修改

将其从body onload更改为jquery文档就绪函数，如上例所示。

在追加后立即选择一个元素 - Jquery

3 个答案: