简体   繁体   English

删除使用append方法附加的div

[英]removing the div appended using append method

this is my code...append is working but removing is not working. 这是我的代码...追加有效,但删除无效。 how to remove the appended div? 如何删除附加的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>

Specify window.close in your html handler: 在您的html处理程序中指定window.close

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

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

Otherwise close() refers to the native close method, which doesn't do anything. 否则, close()引用本机的close方法,该方法不执行任何操作。

Here's how you would emulate it with a "javascript" (as opposed to inline html attribute) handler: 这是使用“ javascript”(与内联html属性相对)处理程序进行模拟的方法:

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

This is not exact reproduction (nor does it work in IE etc, that's not the point) but it would put the .close in Window.prototype in front of the global window.close in the scope, so it shadows it. 这不是精确的复制(在IE等环境中也不起作用,这不是重点),但是它将Window.prototype中的.close放在作用Window.prototype全局window.close前面,因此将其Window.prototype起来。 You can still refer to it explicitly with window.close() . 您仍然可以使用window.close()显式引用它。


You should also totally drop the above and use jQuery instead: 您还应该完全删除上面的内容,改用jQuery:

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

JS: JS:

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

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

    });
});​

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


Making an ajax request that fetches a html file to be appended: 发出aajax请求以获取要附加的html文件:

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

Don't know why but by putting another name to close function instead of close() it works 不知道为什么,但是通过将另一个名称放在close函数而不是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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM