jQuery的負載文本的div刷新

Question

頁面

我需要在一個模式裏一個div加載文本形式存放在目錄txt_files文件

「file.txt的」。

在我的索引

我此jQuery代碼

$('#modal-div').on('show.bs.modal', function (event) { 
    var handler = $(event.relatedTarget); 
    var objData = handler.data(); 

    $('.div-for-text').load('path/to/file'+handler.data('contract'),function(){ 
     console.log('ok, done loading file'); 
    }); 
}); 

所有包裹在一個$(document).load(function(){});

handler.data是一個數據標籤放置在加載模態的按鈕內。它包含文件的名稱（file.txt）。

，並最終這是一個需要與模態中的文本數據填充的DIV：

<p class="div-for-text"> 
    <!--Load Text Here--> 
</p> 

當我嘗試加載模式，並觸發我在控制檯確定看到的功能，做加載文件。但是，然後所有的頁面重新加載和div不填充。

我試着在加載回調函數中添加一個event.preventDefault（），但它不起作用。

有人有同樣的問題？ 感謝您的所有幫助

Answer 1

你應該在你.on()回調函數，而不是​​回調函數的代碼運行event.preventDefault()。

$('#modal-div').on('show.bs.modal', function (event) { 
    // HERE 
    event.preventDefault() 

    var handler = $(event.relatedTarget); 
    var objData = handler.data(); 

    $('.div-for-text').load('path/to/file'+handler.data('contract'),function(){ 
     console.log('ok, done loading file'); 
     // NOT HERE 
    }); 
}); 

Answer 2

您可以使用AJAX獲取文件，然後使用它的內容更新您的<div>。我沒有測試過這一點，但它應該工作：

$('#modal-div').on('show.bs.modal', function (event) { 
    $.ajax({ 
     url : "file.txt", 
     dataType: "text", 
     success : function (data) { 
      $(".div-for-text").html(data); 
     } 
    }); 
});