$就在JQuery中調用同一個虛擬機

代碼中的index.php：

<!DOCTYPE html> 
<html lang="pt-br"> 
    <head> 
     <title></title> 
     <script type="text/javascript" src="jquery-2.2.3.min.js"></script> 
     <script> 
      function carregaPagina(item, pai, filho, url) { 
       var caminho = item != null ? $(item).attr('data-click') : url; 
       if (item != null) { 
        if ($(item).attr('data-json') != null) { 
         $('#' + $(item).attr('local-json')).html($(item).attr('data-json')); 
        } 
       } 
       if (pai != "" && pai != null) { 
        $('#' + pai).slideToggle(1000); 
       } 
       $.ajax({ 
        url: caminho, 
        cache: false, 
        dataType: "html", 
        success: function (data) { 
         $('#' + filho).slideToggle(0); 
         $('#' + filho).html(data); 
         $('#' + filho).slideToggle(1000, function() { 
          if (typeof completaLoad !== 'undefined' && $.isFunction(completaLoad)) { 
           completaLoad(); 
          } 

          if ($('#' + pai).css('display') !== 'none') { 
           $('#' + pai).slideToggle(0); 
          } 
         }); 
        } 
       }); 
       return false; 
      } 

      $(document).ready(function() { 
       $(document).on('click', '.grid', function (e) { 
        if (e.handled !== true) { 
         carregaPagina(this, 'TelaConsulta', 'TelaEditar', null); 
         e.handled = true; 
        } 
        return false; 
       }); 
      }); 
     </script> 
     <style> 
      .grid, .item, .btnVoltar { 
       cursor: pointer; 
      } 
      #TelaConsulta { 
       background-color: #81BEF7; 
      } 
      #TelaEditar { 
       background-color: #58FAAC; 
      } 
      #TelaItem { 
       background-color: #F6D8CE; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="TelaConsulta"> 
      <ul> 
       <li><span class="grid" data-click="editar.php?id=25">Edit</span></li> 
       <li><span class="grid" data-click="editar.php?id=35">Edit</span></li> 
      </ul> 
     </div> 
     <div id="TelaEditar"> 
     </div> 
     <div id="TelaItem"> 
     </div> 
    </body> 
</html>

守則editar.php：

<script> 
     $(document).ready(function() { 
      $(document).on('click', '.item', function (e) { 
       if (e.handled !== true) { 
        debugger; 
        var url = 'item.php?id=<?php echo $_GET['id']; ?>'; 
        carregaPagina(null, 'TelaEditar', 'TelaItem', url); 
        e.handled = true; 
       } 
       return false; 
      }); 
      $('#TelaEditar .btnVoltar').click(function() { 
       $('#TelaEditar').slideToggle(1000, function() { 
        $('#TelaConsulta').slideToggle(1000); 
        $('#TelaEditar').empty(); 
        $('#TelaEditar').removeAttr('style'); 
       }); 
       return false; 
      }); 
     }); 
    </script> 
    Id: <?php 
     echo $_GET['id']; 
    ?><br><br> 
    <span class="item">Item</span><br><br> 
    <span class="btnVoltar">Voltar</span>

守則item.php：

<script> 
    $(document).ready(function() { 
     $('#TelaItem .btnVoltar').click(function() { 
      $('#TelaItem').slideToggle(1000, function() { 
       $('#TelaEditar').slideToggle(1000); 
       $('#TelaItem').empty(); 
       $('#TelaItem').removeAttr('style'); 
      }); 
      return false; 
     }); 
     debugger; 
    }); 
</script> 
Id: <?php echo $_GET['id']; ?><br><br> 
<span class="btnVoltar">Voltar</span>

在index.php文件中點擊1st Edit。

插入項按鈕調試器上editar.php注意，當你點擊它打開VM108按鈕，返回編號25

http://i.stack.imgur.com/RjWER.png

在加載文件item.php筆記插入一個調試器它打開了VM119，並返回標識25

http://i.stack.imgur.com/qsljX.png

不久，我點擊item.php文件返回按鈕，然後editar.php的後退按鈕後。在index.php文件中點擊第二個編輯並返回Id 35.

當你點擊editar.php上的Item按鈕時，它會重新打開VM108。

http://i.stack.imgur.com/hSQfj.png

當它出現在item.php文件，需要注意的是它開啓了VM141，並返回標識25

http://i.stack.imgur.com/2rbwf.png

這是我的疑問，我每次打開editar.php時間它總是讓我回到VM108。發生這種情況時，不會更新項目ID並生成問題。

鏈路仿真：link

來源

2016-04-14 Cristiano Ávila Salomão

我不明白你在做什麼。你能提供一個運動員什麼的嗎？ – Lulylulu

看這個例子[鏈接]（http://microworks.com.br/cristiano/teste/） –

所以...爲什麼不應該使用相同的編譯代碼時，未編譯的代碼是相同的？此外，你說它正在產生一個問題，但不是問題是什麼。你可能不應該依賴於ajax加載的文檔來與父文檔共享狀態。每個應該彼此隔離。 –

發生問題，因爲click事件仍然有效。

如何通過Ajax HTML和JS代碼不知道創建點擊事件，它將在我使用$（document）.on（）進行調用的屏幕上處於活動狀態，以返回到主頁screen'm不刪除事件你應該使用調用$（document）.off（）。

我editar.php文件是這樣的：

<script> 
    $(document).ready(function() { 
     $(document).on('click', '.item', function (e) { 
      if (e.handled !== true) { 
       debugger; 
       var url = 'item.php?id=<?php echo $_GET['id']; ?>'; 
       carregaPagina(null, 'TelaEditar', 'TelaItem', url); 
       e.handled = true; 
      } 
      return false; 
     }); 
     $('#TelaEditar .btnVoltar').click(function() { 
      $('#TelaEditar').slideToggle(1000, function() { 
       //Remove click event 
       $(document).off('click', '.item'); 
       $('#TelaConsulta').slideToggle(1000); 
       $('#TelaEditar').empty(); 
       $('#TelaEditar').removeAttr('style'); 
      }); 
      return false; 
     }); 
    }); 
</script> 
Código: <?php 
    echo $_GET['id']; 
?><br><br> 
<span class="item">Item</span><br><br> 
<span class="btnVoltar">Voltar</span>

這是因爲我在JS直接傳遞的標識，如果我或許在尋求例如表單字段中的值，就沒有必要清理事件。

來源

2016-04-15 12:32:47

$就在JQuery中調用同一個虛擬機

回答

相關問題