перерывы нагрузки JQuery работать

-1

Мой PHP веб-страница page1.php как это:перерывы нагрузки JQuery работать

<html> 
    <head> 
    <script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
    <script> 
    function ciao(){ 
     $('#files').load('page2.php?SQL_type=files'); 
    } 
    $(function(){ 
     $(".icon_files").bind("contextmenu",function(e){ 
     var left; 
     var top; 
     if($(document).width() < 630){ 
     left = 0; 
     top = 0; 
     }else{ 
     left = e.pageX; 
     top = e.pageY; 
     } 
     $("#context").css({left: left, top: top}); 
     contextmenu($(this).attr('id')); 
     e.preventDefault(); 
     }); 
    }); 
    </script> 
</head> 
<body> 
    <button onclick="ciao()">ciao</button> 
    <div id="files"> 
    <?php 
    $_GET['SQL_type'] = 'files'; 
    include "page2.php"; 
    ?> 
    </div> 
</body> 
</html>

Я построить пользовательский ContextMenu, который появляется с указанным кодом.
Когда страница загружается и включает page2.php через PHP, она работает, но когда я изменяю содержимое #files через jQuery, контекстменю (и все остальные функции, которые я не копировал там) больше не работает.

Я пробовал другие коды, как

jQuery.get('page2.php?SQL_type=files', null, function(data) { 
     $('#files').append(data); 
    }, 'html');

И я попытался также с простого Javascript

var xmlhttp = new XMLHttpRequest(); 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
    document.getElementById("files").innerHTML = xmlhttp.responseText; 
    } 
} 
xmlhttp.open("GET", "page2.php?SQL_type=files", true); 
xmlhttp.send();

Внутри page2.php есть просто некоторые DIVs каждый из них с icon_files как класс и он не включает jQuery снова. Это просто как

<div class="icon_files">something</div><div class="icon_files">other</div>

У меня нет никаких других идей, в чем проблема?

источник

2015-05-12 Francesco Sorge

код JQuery работает, однако, элементы кода JQuery пристреливает заменяются после нажатия на кнопку, тем самым заставляя их терять события/данные. –

Итак, следует ли повторно добавлять события после загрузки? –

@FrancescoSorge Вы могли бы, но было бы проще просто делегировать эти события. –

Код jquery запущен, однако элементы, на которые нацелен код jquery, заменяются после нажатия кнопки, что приводит к их потере событий/данных. Вместо этого попробуйте использовать делегирование событий. Это заставляет событие привязываться к элементу id="files", а не к элементам, которые заменяются.

function ciao() { 
 
    $('#files').html('<div class="icon_files">another icon...</div>'); 
 
} 
 
$(function() { 
 
    $("#files").on("contextmenu", ".icon_files", function(e) { 
 
    var left; 
 
    var top; 
 
    if ($(document).width() < 630) { 
 
     left = 0; 
 
     top = 0; 
 
    } else { 
 
     left = e.pageX; 
 
     top = e.pageY; 
 
    } 
 
    $("#context").css({ 
 
     left: left, 
 
     top: top 
 
    }); 
 
    console.log('context menu'); 
 
    e.preventDefault(); 
 
    }); 
 
});

<html> 
 

 
<head> 
 
    <script src="//code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
 
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
    <script> 
 
    </script> 
 
</head> 
 

 
<body> 
 
    <button onclick="ciao()">ciao</button> 
 
    <div id="files"> 
 
    <div class="icon_files">icon...</div> 
 
    </div> 
 
</body> 
 

 
</html>

источник

2015-05-12 14:29:52

Большое вам спасибо! Он отлично работает: D –

перерывы нагрузки JQuery работать

ответ

Смежные вопросы