开发者

How do I bind appended html with jQuery?

开发者 https://www.devze.com 2023-01-15 10:15 出处:网络
I\'m loading HTML content and appending this to a DIV. The problem then of course, is that the HTML is not bound.

I'm loading HTML content and appending this to a DIV. The problem then of course, is that the HTML is not bound.

Since I'm not clicking anything, I can't use jQuery.live or jQuery.bind (I think).

Here is my code.

// Load directory content and display list
  function loadDirContent(current_path,new_dir)
  {  
    // Load new content in browser window
    jQuery.ajax({
        type: "POST",
        url: "../wp-content/plugins/wp-filebrowser/fileBrowser.php",
        dataType: 'html',
        data: {current_path: current_path, new_dir: new_dir},

        su开发者_如何转开发ccess: function(html){
                 jQuery("#fileBrowser").html(html); // Append new content
        }
    });  
  }

How can I bind this new HTML so that I may run jQuery on the added content?

I face the problem when I use the Ajax Upload Plugin. It fetches data from the form, but any $_POST data is left blank. This occurs only after "page reload" using my loadDirContent function.

UPDATE

I have the following input in my form: relative_url; ?>" /> Each time I go one directory down in my file browser, current_path is updated.

Ajax File Upload Plugin calls the uploader.php function. Inside uploader.php I have the following command: $this->current_path = $_POST['current_path'];

The problem is that $_POST['current_path'] is empty.


$().live and $().delegate will both work on events other than click. What event are you binding handlers to?

Additionally, if live/delegate really won't work, you can always bind handlers within the success callback.


Example:

// function for doing event binding:
function bindHandlers(root) {
    // do any event binding here, only selecting elements within the provided root
    $('.something', root).click(...);
    $('.something-else', root).hover(..., ...);
};

// bind all children of the document on dom ready
$(function() { bindHandlers(document); });

// Load directory content and display list
function loadDirContent(current_path,new_dir)
{  
  // Load new content in browser window
  jQuery.ajax({
      type: "POST",
      url: "../wp-content/plugins/wp-filebrowser/fileBrowser.php",
      dataType: 'html',
      data: {current_path: current_path, new_dir: new_dir},

      success: function(html){
          // append the new stuff and attach handlers
          bindHandlers($('#fileBrowser').html(html));
      }
  });  
}


You may want to check the solutions I received in my recent, similar question. Both are good answers (I marked the one that helped me). From the looks of what you're doing, you'll probably want to re-assign handlers for the content after you add it.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号