Question

这是我的代码...追加工作但删除工作无效。如何删除附加的div？

<html>
  <head>
    <script type="text/javascript">
      function view(){
        $('body').append('<div class="added"><p>something</p></div>');
      };
      function close(){
        $('.added').remove();
      } ;
    </script>
  </head>
  <body>
    <a onclick="view();">something</a>
    <a onclick="close();">close</a>
  </body>
</html>

Answer 1

在html处理程序中指定window.close：

   <a onclick="window.close();">close<a>

http://jsfiddle.net/ZTwd7/1/

否则close()引用原生close方法，该方法不执行任何操作。

以下是使用“javascript”（与内联html属性相对）处理程序来模拟它的方法：

elem.onclick = function(event) {
    with(Window.prototype) {
        with(document) {
            with(this) {
                close();
            }
        }
    }
};

这不是完全复制（在IE等中也不起作用，这不是重点）但它会将.close置于Window.prototype的全局window.close之前范围，所以它遮蔽它。您仍然可以使用window.close()明确引用它。

你也应该完全放弃上面的内容并改用jQuery：

<a id="view">something<a>
<a id="close">close<a>

JS：

$(function() {
    $("#view").click(function() {
        $('body').append('<div class="added"><p>something</p></div>');

    });
    $("#close").click(function() {
        $('.added').remove();

    });
});

http://jsfiddle.net/ZTwd7/5/

发出一个ajax请求来获取要追加的html文件：

$.get("myhtml.html", function(html) {
    $("body").append(html);
}, "html");

Answer 2

不知道为什么，但是通过使用另一个名称来关闭函数而不是close（）它可以工作

<html>
    <head>
<script src="http://code.jquery.com/jquery-latest.js"></script>

   <script type="text/javascript">
            function view(){
                     $('body').append('<div class="added"><p>something</p></div>');
            };
            function close_it(){
                                       $('.added').remove();

            } ;

    </script>
</head>
<body>
   <a onclick="view();">something<a>
   <a onclick="close_it();">close<a>
</body></html>

删除使用append方法追加的div

2 个答案: