Question

欢迎我在登陆jquery时遇到问题。我使用empty（）或remove（）函数从div中删除所有。问题是当页面动态加载到div中时，我无法使用jquery访问该div内的任何加载元素。

来自get响应的数据与以下相同

＆＃13;

<div id="menu">
  <ul>
    <li><a href="#">link</a> <a href="#e">[E]</a>
      <ul>
        <li><a href="#">link</a> <a href="#e">[E]</a></li>
      </ul>
    </li>
    <li><a href="#">link</a> <a href="#e">[E]</a></li>
  </ul>
</div>

＆＃13;

$('#menu').empty()

＆＃13;

$.get('.php?id=get_menu', function(data) 
      {
	    $('#menu').append(data);
      });

＆＃13;

加载后如果我点击e（编辑）jquery什么都不做

这是一个使用

的jquery脚本

＆＃13;

$('.form').submit(function(event) {
  var $form = $(this);
  var $inputs = $form.find("input, select, button, textarea");
  var serializedData = $form.serialize();
  
  request = $.ajax({
	url: "check.php?id=update_menu",
	type: "post",
	data: serializedData
  });
  
  request.done(function (response, textStatus, jqXHR){
    $('#menu').empty('<div class="preloader-big"></div>');
    $.get('admin_index.php?id=get_menu', function(data) {
		$('#menu').append(data);
    });
  });
  
  request.always(function () {
    $('.preloader-big').fadeOut();
  });
});

＆＃13;

php脚本输出准备好使用格式化html代码

我的回答

此代码在字母e

上点击后获取php数据

＆＃13;

    $('.optedit').on('click', function() {
     
      $.get('admin_index.php?id=get_menu_edit&mid='+menu_id[1], function(data) {
        
        $('#link_name').val(res[2]);
        $('#link_title').val(res[3]);
        $('#mid').val(res[1]);
        )};
    )};

＆＃13;

我只是将他打包成一个我称之为update_menu（）的函数;

之后重复这个功能

＆＃13;

$.get('.php?id=get_menu', function(data) {
  $('#menu').append(data);
  update_menu();
})

＆＃13;

这会更新jquery代码以使用刚刚添加的代码。一切正常。

感谢您的帮助：）

Answer 1

empty()不仅会删除子元素（和其他后代元素），还会删除匹配元素集合中的任何文本。

如果要删除元素而不破坏其数据或事件处理程序（以便以后可以重新添加），请改用.detach()。

Answer 2

似乎在这里工作，检查你的结果.php？id = get_menu

	    $('#ammend').on('click',function(){
          $('#menu').append('<ul><li>hello</li><li>there</li></ul>');
          });
$('#empty').on('click',function(){
          $('#menu').empty();
          });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="ammend">Ammend</button>
<button id="empty">Empty</button>
<div id="menu">
  <ul>
    <li><a href="#">link</a> <a href="#e">[E]</a>
      <ul>
        <li><a href="#">link</a> <a href="#e">[E]</a></li>
      </ul>
    </li>
    <li><a href="#">link</a> <a href="#e">[E]</a></li>
  </ul>
</div>

Answer 3

您的代码似乎没有问题。您必须检查通话.php?id=get_menu中使用的网址。这似乎不完整。

此外，您可能希望检查jQuery的加载而不是简化操作。这是如何使用它：

$("#menu").load("content_generator.php");

如果你想成功举办一场活动：

$("#menu").load("content_generator.php", function(){
    console.log("Successful")
});

让我知道这是否清楚。

jQuery load documentation

Answer 4

我粘贴在我的jquery代码之上。这样做可以与php联系并输出一些HTML代码

动态加载页面后无法访问dom树

4 个答案: